Hand-Drawn Diagrams
External agent skill for generating editable Excalidraw-style diagrams, animated SVGs, and PNGs from natural-language prompts.
What it is
muthuishere/hand-drawn-diagrams is a skill-style repo for Claude Code, Codex CLI, OpenCode, Cursor, and other agents. The README says it chooses diagram type from a prompt, lays out non-overlapping Excalidraw elements, validates the layout, and can return a hosted edit URL, animated SVG, source .excalidraw, or PNG. Source: GitHub README, 2026-06-26
It sits on top of Excalidraw rather than replacing it: output remains standard Excalidraw data, and animation is powered by excalidraw-animate. Source: GitHub README, 2026-06-26
Routing
Use this as a reference candidate when the output should feel like a hand-drawn architecture, UX, teaching, funnel, or workflow diagram.
Kevin already has Security and Review Skills and Browser Testing Skills. So this page is not an installed default yet; it is a candidate source if Kevin wants editable Excalidraw diagrams with hosted edit URLs and stroke-draw animation.
Guardrails
Do not install external skills blindly. If promoted to an executable skill, run the normal skill-audit path first, verify what scripts execute, and add the catalog/routing entry only after installation.
Timeline
- 2026-06-26 | Promoted as a reference candidate from Kevin's GitHub stars harvest. GitHub API reported 45 stars, Python, and topics
agent-skills,claude-code,codex,diagramming,excalidraw,ux-wireframes, andworkflow-diagrams. Source:raw/github/muthuishere_hand-drawn-diagrams-repo-2026-06-26.json; GitHub API, 2026-06-26