diagram-design

cathrynlavery/diagram-design

Editorial diagram design for Claude Code, Codex, GitHub Copilot, Cursor, Factory Droid, Qoder, and Pi. 45 diagram types. Self-contained HTML + SVG. No shadows. No Mermaid slop.

Install

GitHub: cathrynlavery/diagram-design
Website: diagramdesign.dev
Stars: ★ 60.8k
License: MIT
Language: HTML
Last push: Oct 24, 2026
Topics: codex · data-visualization · diagrams · drawio · mermaid · svg

Good for

Ask the agent in plain words to draw one of 45 diagram types, such as an architecture, quadrant or sequence diagram
Get each diagram as one self-contained HTML + SVG file you can open by double-clicking
Point onboard at your site so every later diagram uses your palette and fonts
Import from draw.io, Mermaid or Excalidraw, or export to PNG and SVG

Getting started

Run npx skills add cathrynlavery/diagram-design
In Claude Code run /plugin marketplace add and /plugin install diagram-design@diagram-design
Describe what you want in plain words, e.g. an architecture diagram of frontend, backend, database and Redis cache
The agent picks the type, states its plan and writes one .html file

Before you install

Compatible with Cursor, Claude Code, Codex, Qoder, GitHub Copilot, Gemini CLI and more. Official builds come only from this repository, and PRIVACY.md lists what the skill sends over the network.

Summarized by AI from the project docs; check the official docs before relying on it.

Similar tools

logo-design-skillCommunity skills · ★ 4.5k
A comprehensive logo-design skill for Claude, Gemini CLI, Codex and other AI agents: principles, process, SVG craft, testing tools and a 1,400+ logo reference library.
reaCommunity skills · ★ 380k
Reverse engineer anything with agents, from app behavior down to native binaries.
agent-skillsCommunity skills · ★ 110k
Production-grade engineering skills for AI coding agents.
taste-skillCommunity skills · ★ 102k
Agent skills that give coding agents taste: art direction, reference images and a browser check instead of generic AI pages
archifyCommunity skills · ★ 88.8k
Turn any idea, plan, or codebase into a beautiful interactive diagram. An agent skill for Claude Code, Codex, and more.