Diagram Design
cathrynlavery/diagram-designReviewed by AI
What it does
A skill you install inside an AI coding assistant (Claude Code, Codex, Cursor, Copilot and others). You describe the diagram in your own words and the assistant writes one self-contained HTML file with the drawing inside, in one editorial style: 45 types, from architecture and flowcharts to Gantt, Sankey and org charts. It can copy the colours and fonts from your website so diagrams match your brand, redraw existing draw.io, Mermaid or Excalidraw files, and save the result as SVG or PNG. You need an AI assistant, which usually needs a paid plan.
How easy it is to install
C · install 1 or 2 tools · Windows
- Windows C
- macOS C
- Linux C
On any of the three systems you first need an AI assistant installed, then one or two commands: `npx skills add cathrynlavery/diagram-design` (which needs Node) or, in Claude Code, `/plugin marketplace add` plus `/plugin install`. Finished diagrams are plain HTML files that open with a double-click. On Windows the README notes that symlinks need Developer Mode, otherwise the installer makes copies, and PNG export asks for an extra install (`pip install playwright && playwright install chromium`).
Numbers on GitHub
- Stars
- 63,485on Oct 31, 2026
- Downloads
- —all releases
- Growth
- +2,107stars in 5 days
Stars over time
Facts
- Runs on
- Windows, macOS, Linux
- You need to install
- Other tools, Node.js
- Disk space
- not determined
- Accounts or keys
- None
- Cost
- Free, API costs extra · The skill is free (MIT). It only works inside an AI assistant, which usually needs a paid plan or paid API use, and each diagram spends some of that allowance.
- License
- MIT (Permissive)
- Can replace
- Lucidchart, Visio, Figma
- Last update
- Oct 27, 2026
Risk signals (4)
- Inforeads your website for branding
README onboarding flow: "onboard diagram-design to https://yoursite.com" → "fetches the homepage → extracts the dominant palette + font stack". The assistant visits a site you name and writes the colours into references/style-guide.md. The README points to PRIVACY.md for what the skill sends over the network.
AI review
- Infodiagrams fetch google fonts
README, Offline fonts: "By default a diagram loads Instrument Serif, Geist and Geist Mono from Google Fonts, the only network request it makes." Asking for system fonts makes the file completely offline.
AI review
- Infocopycat listings warning
README Install: "Official builds come only from this repository. LittleMight, Cathryn Lavery's company, publishes the plugin directory listings; a listing under any other name is an unofficial copy."
AI review
- Inforesults vary between runs
README, How it compares: "The downsides are real. Output quality depends on the model you run it with, and the same prompt can lay out differently twice. The result is not an editable source format: there is no text to diff in a pull request and no canvas to drag a box on."
AI review
Evidence is shown in its original language.
What Radar could not check
- How good the diagrams are with your own assistant and model, since the author says output depends on both
- Whether the brand onboarding really picks the right colours and fonts from a given website
- What the skill and the generated files send over the network beyond the Google Fonts request
- Whether every listed host (Cursor, Copilot, Qoder, Pi, Kiro and the rest) installs it as described, especially on Windows
- How much of your AI plan a diagram consumes