Diagram Design
Editorial-grade diagrams as self-contained HTML and SVG, in 45 layouts.
Use it for
Docs and launch posts where a diagram must look deliberate
Skip it if
Quick sketches; the typographic system is overhead
What it is
Rejects the default robot aesthetic: no drop shadows, no Mermaid defaults, a fixed typographic system. The skill supplies layout patterns — sequence, comparison, layered stack — and the agent fills them with your content. Best for documentation and launch posts where a diagram has to look deliberate rather than generated.
Install
Clone the repository, then copy the skill folder into your agent's skills directory — ~/.claude/skills/ for Claude Code. Skills are plain files: no build step, no daemon.
git clone https://github.com/cathrynlavery/diagram-design.gitHow to judge it
Read the SKILL.md before you install. A good skill states when it applies, what it must not do, and how to verify the result. A skill that only lists adjectives will change the agent's tone without improving its output — skip those.
Other Image & Design skills
- Impeccable — A design-quality skill that hunts the tells of AI-generated interfaces.
- Taste Skill — Art direction and a browser check, for when generated pages look generated.
- Huashu Design — One sentence in, a deliverable out: page, prototype, PPTX, animation, infographic.