update-workflow-diagram
Installation
SKILL.md
Update Workflow Diagram from Mermaid
Purpose
Regenerate the website/ai-workflow.svg file from the canonical mermaid diagram in docs/agents.md. The website uses a hand-crafted blueprint-styled SVG that preserves the exact layout generated by mermaid but applies a custom visual style (technical drawing aesthetic with cyan/white on dark blue).
When to Use
- After changes to the mermaid diagram in
docs/agents.md - When adding, removing, or renaming agents/artifacts
- When modifying the workflow connections
Hard Rules
Must
- Use mermaid-cli (
mmdc) to render the mermaid diagram to SVG - Parse the generated SVG to extract node positions and path definitions
- Preserve exact node positions and path routing from mermaid output
- Apply blueprint styling consistently per node type
- Keep the SVG self-contained (all styles inline or in
<style>block)