Excalidraw Diagram Skill
I drop in coleam00/excalidraw-diagram-skill so Claude Code emits Excalidraw JSON I can finish-editing in excalidraw.com, boxes, arrows, colors all stay editable instead of being baked into static SVG. The skill outputs interactively-editable JSON rather than a frozen render: you give the initial prompt, Claude creates the structure (boxes, text, arrows, colors), and you finish with the mouse in Excalidraw instead of iterating via prompt. Self-correcting Playwright render pipeline to avoid overlaps before export.
Strengths
- Interactively-editable Excalidraw JSON output, finish with the mouse instead of reprompting Claude to move a box
- Self-correcting Playwright render: the skill detects overlaps and fixes them before export, no broken layouts
- Native Excalidraw: colors, boxes, arrows, text all manipulable like a regular Excalidraw diagram
Limitations
- Single maintainer (Cole Medin), low bus factor, longevity worth monitoring like diagram-design
- Two-step workflow (Claude generates, you edit in excalidraw.com), less immediate than diagram-design's screenshot-ready HTML+SVG
- Claude Code only, no MCP/API equivalent
Best for
- Diagrams you want to tweak visually after Claude's first pass, flowcharts, mindmaps, explanatory schemas
- Iterative workflow where the diagram evolves through team conversations (Excalidraw shareable via URL)
- Slides or docs where the Excalidraw hand-drawn aesthetic fits better than corporate HTML+SVG