Excalidraw
MCP server and Claude Code skill for Excalidraw — programmatic canvas toolkit to create, edit, and export diagrams via AI agents with real-time canvas sync.
MCP server and Claude Code skill for Excalidraw — programmatic canvas toolkit to create, edit, and export diagrams via AI agents with real-time canvas sync.
{
"mcpServers": {
"excalidraw": {
"command": "node",
"args": [
"/absolute/path/to/mcp_excalidraw/dist/index.js"
],
"env": {
"EXPRESS_SERVER_URL": "http://127.0.0.1:3000",
"ENABLE_CANVAS_SYNC": "true"
}
}
}
}
# Excalidraw MCP Server & Agent Skill [](https://github.com/yctimlin/mcp_excalidraw/actions/workflows/ci.yml) [](https://github.com/yctimlin/mcp_excalidraw/actions/workflows/docker.yml) [](https://www.npmjs.com/package/mcp-excalidraw-server) [](LICENSE) Run a live Excalidraw canvas and control it from AI agents. This repo provides: - **MCP Server**: Connect via Model Context Protocol (Claude Desktop, Cursor, Codex CLI, etc.) - **Agent Skill**: Portable skill for Claude Code, Codex CLI, and other skill-enabled agents Keywords: Excalidraw agent skill, Excalidraw MCP server, AI diagramming, Claude Code skill, Codex CLI skill, Claude Desktop MCP, Cursor MCP, Mermaid to Excalidraw. ## Demo  *AI agent creates a complete architecture diagram from a single prompt (4x speed). [Watch full video on YouTube](https://youtu.be/ufW78Amq5qA)* ## Table of Contents - [Demo](#demo) - [What It Is](#what-it-is) - [How We Differ from the Official Excalidraw MCP](#how-we-differ-from-the-official-excalidraw-mcp) - [What's New](#whats-new) - [Quick Start (Local)](#quick-start-local) - [Quick Start (Docker)](#quick-start-docker) - [Configure MCP Clients](#configure-mcp-clients) - [Claude Desktop](#claude-desktop) - [Claude Code](#claude-code) - [Cursor](#cursor) - [Codex CLI](#codex-cli) - [OpenCode](#opencode) - [Antigravity (Google)](#antigravity-google) - [Agent Skill (Optional)](#agent-skill-optional) - [MCP Tools (26 Total)](#mcp-tools-26-total) - [Testing](#testing) - [Troubleshooting](#troubleshooting) - [Known Issues / TODO](#known-issues--todo) - [Development](#development) ## What It Is This repo contains two separate processes: - Canvas server: web UI + REST API + WebSocket updates (default `http://127.0.0.1:3000`) - MCP server: exposes MCP tools over stdio; syncs to the canvas via `EXPRESS_SERVER_URL` ## How We Differ from the Official Excalidraw MCP Excalidraw now has an [official MCP](https://github.com/excalidraw/excalidraw-mcp) — it's great for quick, prompt-to-diagram generation rendered inline in chat. We solve a different problem. | | Official Excalidraw MCP | This Project | |---|---|---| | **Approach** | Prompt in, diagram out (one-shot) | Programmatic element-level control (26 tools) | | **State** | Stateless — each call is independent | Persistent live canvas with real-time sync | | **Element CRUD** | No | Full create / read / update / delete per element | | **AI sees the canvas** | No | `describe_scene` (structured text) + `get_canvas_screenshot` (image) | | **Iterative refinement** | No — regenerate the whole diagram | Draw → look → adjust → look again, element by element | | **Layout tools** | No | `align_elements`, `distribute_elements`, `group / ungroup` | | **File I/O** | No | `export_scene` / `import_scene` (.excalidraw JSON) | | **Snapshot & rollback** | No | `snapshot_scene` / `restore_snapshot` | | **Mermaid conversion** | No | `create_from_mermaid` | | **Shareable URLs** | Yes | Yes — `export_to_excalidraw_url` | | **Design guide** | `read_me` cheat sheet | `read_diagram_guide` (colors, sizing, layout, anti-patterns) | | **Viewport control** | Camera animations...
A collection of MCP servers.
Chrome DevTools for coding agents
Enhanced ChatGPT Clone: Features Agents, MCP, DeepSeek, Anthropic, AWS, OpenAI, Responses API, Azure, Groq, o1, GPT-5, M...
Playwright MCP server
GitHub's official MCP Server
🚀 The fast, Pythonic way to build MCP servers and clients.