diagram-design-system

Installation
SKILL.md

diagram-design-system

One file decides how every diagram looks. design-system.md holds a ```design-tokens JSON block the scripts read and prose (vocabulary, principles, do/don't) the drawing model reads. Every renderer — illustration-draw (cards, architecture, timelines, icons), mermaid-draw (beautiful-mermaid, Graphviz, the Mermaid config), diagram-animate, and diagram-review's lint — loads it the same way, so pointing at another file restyles everything on the next render.

Resolution order (first hit wins): --design-system PATH-or-NAME → $DIAGRAM_DESIGN_SYSTEM → ./design-system.md → the built-in Studio look (assets/design-system.md). A name (coral) is looked up as <name>.md in ./themes/, each folder of $DIAGRAM_THEMES, ~/.config/diagram-skills/themes/, then the shipped assets/themes/; design_tokens.py --list-themes shows what resolves. A theme file lists only what it changes and inherits the rest ("extends" takes a name or a path). Outputs bake the tokens at generation time: switching themes means regenerating, never editing SVGs.

Installs
7
First Seen
Sep 24, 2026