メニュー
Generate a programmatic SVG Gantt chart with phase-coded colors, task bars, sub-tasks, milestones, and dark-theme design. Use when creating or updating the visual timeline.
Codex または Claude でインストール この Prompt をコピーして Codex、Claude、または他のアシスタントに貼り付けると、Skill ページを確認してインストールできます。
SOC 職業分類に基づく
| name | svg-gantt-generator |
| description | Generate a programmatic SVG Gantt chart with phase-coded colors, task bars, sub-tasks, milestones, and dark-theme design. Use when creating or updating the visual timeline. |
| user-invocable | false |
| allowed-tools | Read, Grep, Glob, Write |
Generate .github/gantt-chart.svg from structured timeline data.
This skill is invoked by gantt-chart and project-architect, not directly by users.
Gradient definitions for each phase and sub-task variant:
Background: Full-width rect with #0f172a fill, 12px border radius
Title: Centered at y=40, #f8fafc, 20px bold
Week header row: Week labels (W1, W2, ...) centered in columns
Grid lines: Vertical lines per week at 10% opacity (#334155)
Phase background bands: Colored rects at 5% opacity spanning phase weeks
Epic bars: For each epic:
Milestone diamonds: <polygon> at milestone positions with phase color
Legend: Phase color key at bottom
-apple-system, 'Segoe UI', Arial, sans-serifResearch and catalog industry standards and frameworks applied to the project with citations, application mapping, and maturity model. Use alongside domain research to ground the project in established practice.
Create or update the version history following Keep a Changelog 1.1.0 format. Use as the final step after all artifacts are generated.
Analyze the work breakdown structure to identify critical path, parallel work opportunities, dependency chains, resource conflicts, and bottlenecks. Use after JIRA structure defines epics.
Research the problem domain to understand industry standards, terminology, regulatory requirements, and artifact expectations. Use when starting a new project or when industry context is needed for planning artifacts.
Generate an executive-ready slide deck as HTML slide sources with Node.js build scripts for PowerPoint assembly. Use as the final deliverable after all artifacts are complete.
Create a visual project timeline with SVG Gantt chart, Mermaid critical path diagram, dependency matrix, and milestone tracking. Use after JIRA structure and dependency analysis are complete.