What is mcp-excalidraw?
mcp-excalidraw gives AI agents a live Excalidraw canvas they can draw on, inspect, refine, and save into your repo. It lets coding agents create architecture diagrams and flowcharts programmatically, see their work via screenshots, fix layout problems, and export .excalidraw files that can be committed alongside code. It works with three interfaces: a CLI/agent skill, an MCP server (26 tools over stdio), and a REST API.
How to use mcp-excalidraw?
Installation requires Node.js ≥ 18. For coding agents, run npx -y mcp-excalidraw-server install-skill --dir <skills-root> to install the portable skill, then use CLI commands like add, describe, screenshot, export, and import. For MCP clients, add the provided npx configuration to the client’s settings. The canvas server auto-starts on http://127.0.0.1:3000 when a drawing command is invoked (opt out with EXCALIDRAW_NO_AUTOSTART=1). Explicit start and stop commands manage the server.
Key features of mcp-excalidraw
- 26 MCP tools for full element-level CRUD, layout, snapshots, and file I/O.
- CLI-first – composable commands with JSON output and meaningful exit codes.
- Auto‑starting canvas server – no separate setup for drawing commands.
- Agent sees the canvas –
describe (structured text) and screenshot (image) enable iterative refinement.
- Mermaid conversion –
mermaid / create_from_mermaid and share for encrypted URLs.
- Multi‑agent support – multiple agents on the same canvas concurrently.
Use cases of mcp-excalidraw
- Coding agents drawing architecture diagrams from a single prompt and iterating until labels fit and arrows route cleanly.
- Flowcharts and diagrams as code artifacts – export
.excalidraw files into the repo, commit, re‑import, and refine.
- Self‑verifying diagrams – the agent screenshots its own work and fixes truncation or overlap before marking a task complete.
- Diagrams in CI or headless environments – CLI works without a browser tab (except for screenshot and Mermaid features).
评论