Back to MCP Servers

Excalidraw MCP Server

Official Excalidraw MCP server that streams hand-drawn style diagrams into chat with draw-on animations and interactive fullscreen editing.

Collaboration by Excalidraw None active
Overview

The Excalidraw MCP server is an official Model Context Protocol app from the Excalidraw team that lets AI assistants generate hand-drawn style diagrams directly inside chat clients. Instead of returning plain text or static images, the server streams Excalidraw elements one by one with smooth draw-on animations, supports viewport camera control, and provides an interactive fullscreen editor so users can refine generated diagrams after the model produces them.

The server exposes a small, focused set of tools: a read_me reference that teaches the model the Excalidraw element JSON format and color palettes, a create_view tool that renders the streamed diagram, an export_to_excalidraw tool that uploads diagrams to excalidraw.com for sharing, and checkpoint tools (save_checkpoint, read_checkpoint) that persist user edits so a diagram can be reopened and modified across sessions.

It is built on the MCP Apps pattern, meaning it works with any client that supports rich app rendering (Claude, ChatGPT, VS Code, Goose). The recommended deployment is the hosted endpoint at https://mcp.excalidraw.com, but the repository is open source (MIT) and can be self-hosted via Node.js or deployed to Vercel with no environment variables required.

Tools

Tool Description
read_me Returns the Excalidraw element format reference with color palettes, examples, and tips. Should be called before using create_view for the first time.
create_view Renders a hand-drawn diagram using Excalidraw elements. Elements stream in one by one with draw-on animations.
export_to_excalidraw Uploads a diagram to excalidraw.com and returns a shareable URL. App-internal tool, not exposed directly to the model.
save_checkpoint Updates a checkpoint with user-edited state so the diagram can be restored later. App-internal tool.
read_checkpoint Reads checkpoint state for restoring a previously edited diagram. App-internal tool.
Setup Guide

Option 1: Remote server (recommended)

Point your MCP Apps compatible client at the hosted endpoint. No installation, no API keys.

{
  "mcpServers": {
    "excalidraw": {
      "url": "https://mcp.excalidraw.com"
    }
  }
}

Option 2: Install the prebuilt extension (Claude Desktop)

  1. Download excalidraw-mcp-app.mcpb from the GitHub Releases page.
  2. Double-click the file to install it in Claude Desktop.

Option 3: Build from source

Requires Node.js and pnpm.

git clone https://github.com/excalidraw/excalidraw-mcp.git
cd excalidraw-mcp
pnpm install && pnpm run build

Then add this to ~/Library/Application Support/Claude/claude_desktop_config.json:

{
  "mcpServers": {
    "excalidraw": {
      "command": "node",
      "args": ["/path/to/excalidraw-mcp/dist/index.js", "--stdio"]
    }
  }
}

Option 4: Self-host on Vercel

Fork the repo, import it at vercel.com/new, and deploy. No environment variables are required.

Prerequisites

  • A client that supports MCP Apps rendering (Claude, ChatGPT, VS Code, Goose).
  • For local builds: Node.js and pnpm.
Use Cases
  • Generate architecture diagrams during design conversations and edit them inline without leaving the chat client.
  • Sketch flowcharts, sequence diagrams, or system maps from a natural language description and stream them in with draw-on animations.
  • Iterate on a diagram across sessions using checkpoints, so user edits persist when the agent reopens the view.
  • Produce shareable Excalidraw URLs for teammates by exporting AI-generated diagrams to excalidraw.com.
  • Teach concepts visually by asking an assistant to draw and annotate ideas in real time during a tutoring or onboarding session.
Example Prompts
  • "Draw an architecture diagram showing user to API gateway to microservices to a Postgres database."
  • "Sketch a state machine for an order: placed, paid, shipped, delivered, returned."
  • "Draw a cute cat using Excalidraw."
  • "Diagram a typical OAuth2 authorization code flow with PKCE."
  • "Create a flowchart for our incident response runbook and give me a shareable excalidraw.com link."
Pros
  • Official, maintained by the Excalidraw team under the excalidraw GitHub org.
  • Hosted endpoint at mcp.excalidraw.com means zero setup and no API keys.
  • Streams diagrams with hand-drawn animations and offers a real fullscreen Excalidraw editor for refinement.
  • Open source under MIT and easy to self-host on Vercel with no env vars.
Limitations
  • Requires a client that supports MCP Apps rendering; plain text only MCP clients cannot show the diagram.
  • The model-facing surface is intentionally small (read_me, create_view); fine-grained programmatic element manipulation (align, group, export to SVG/PNG) is not part of the official tool set.
  • Documentation in the README is minimal; tool semantics are best understood by reading the source.
Alternatives
  • yctimlin/mcp_excalidraw: community Excalidraw MCP with a larger toolset for programmatic element creation, editing, alignment, and PNG/SVG export.
  • Mermaid MCP servers: generate Mermaid syntax diagrams (flowcharts, sequence, ER) as an alternative to hand-drawn style.
  • tldraw: another whiteboard-style canvas with community MCP integrations.