Diagram Design
MIT agent skill for editorial HTML/SVG diagrams — 40+ layout types, brand-matched, no server
Design / UI · OSS/MIT · 57.9k
Reviewed 2026-10-07 · last push 2026-10-16 · repo checked 2026-10-19
What's Good
MIT (cathrynlavery/diagram-design). Free path: install as a plugin in Claude Code, Copilot CLI or Droid, pi install it, or import the skill folder into any Agent Skills host such as Kiro or Codex. Output opens straight in a browser with no build step or JavaScript. It can pull brand colors and fonts from a site you name, and redraw existing draw.io, Mermaid or Excalidraw sources. Privacy policy says no server, accounts, analytics or telemetry. Browse every type in the live gallery before installing. ★~44k.
The Catch
It is instructions plus templates, so quality depends on the model running it, and a weak model still produces weak layouts. The look is deliberately opinionated (minimal, single accent color); if you want hand-drawn or diagrams-as-code you edit and diff, Excalidraw or D2 fit better. Generated files load fonts from Google Fonts unless you strip the link. Brand onboarding fetches the website you point it at.
Verdict
Install this if your agent writes docs or READMEs — free, local, and it makes agent-drawn diagrams look designed; just know it is a skill, not a renderer.
Embed
Maintainer? Add the badge to your README. It is free, links to this review, and there is no paid version.
Markdown
[](https://stackgems.com/gems/diagram-design)
HTML
<a href="https://stackgems.com/gems/diagram-design"><img src="https://stackgems.com/badge/diagram-design.svg" alt="Diagram Design reviewed on Stack Gems" height="20"></a>