diagram-design

Diagram-design is a Claude Code skill for editorial-quality diagrams. Architecture sketches, flowcharts, sequence diagrams, quadrants, pyramids. 13 types total, all rendered as self-contained HTML and SVG with no JavaScript or build step. The output is opinionated: low density, restrained color, accent used sparingly on the one or two things that matter. It looks like something a design team made, not generic AI output.

Install is clone or plugin, then tell Claude to onboard it to your website and it pulls your brand palette and typography from your homepage. After that every diagram uses your colors. The skill activates automatically when you ask for a diagram.

Solo writers and technical bloggers: install it. Small teams with a brand style guide: install it team-wide and onboard to your site. Large teams with a design system: the editorial constraints may conflict with your existing design language, evaluate first.

The catch: the plugin route puts the skill in a cache that updates overwrite, so style-guide customizations get wiped unless you clone the repo and symlink. And the opinionated style is the whole pitch. If you want Mermaid-style diagrams, this is the wrong tool.