
Excalidraw Skill
This is a full-featured toolkit for building Excalidraw diagrams programmatically through MCP tools or REST API. It handles the entire lifecycle: create elements, query and update them, export to PNG/SVG, save snapshots, convert Mermaid diagrams, and most importantly, lets agents iterate by taking screenshots of their own work to refine layouts. The source documentation is unusually thorough about coordinate systems, spacing rules, and common layout mistakes like putting labels on background zones or drawing arrows that cross through unrelated shapes. It requires running a local Express server on port 3000. If you need agents to draw architecture diagrams, flowcharts, or any visual explanation that benefits from programmatic layout and iterative refinement, this does the job.
- skills.sh installs
- 530
- GitHub stars
- 2.6K
- last updated
- Aug 21, 2026
Install
$ npx -y skills add yctimlin/mcp_excalidraw --skill excalidraw-skill --agent claude-codeInstalls into .claude/skills of the current project.
Files
Excalidraw Skill
Step 0: Pick an Interface
Three interfaces drive the same live canvas. Pick the first one that applies:
- MCP tools — if
excalidraw/*tools (e.g.batch_create_elements) are in your tool list, prefer them: results land directly in your context, and screenshots come back as images without touching disk. - CLI (default when no MCP tools are present):
No setup needed — any canvas-touching command auto-starts the canvas server onnpx -y mcp-excalidraw-server <command>http://127.0.0.1:3000(firstnpxrun downloads the package). If the CLI is installed globally (npm i -g mcp-excalidraw-server), the shorter aliasexcalidraw-canvas <command>works too. - REST API (last resort, e.g. from application code): HTTP endpoints on
http://127.0.0.1:3000— seereferences/cheatsheet.mdfor payloads. The server must already be running.
Sponsors
Details
- Repository
- github.com/yctimlin/mcp_excalidraw
- Categories
- Backend & APIs, AI & Agent Building, CLI & Terminal
- First seen
- Jun 3, 2026