Draw.io MCP server

What is Draw.io MCP server?

Draw.io MCP server is an MCP server that lets AI agents control Draw.io diagrams programmatically. It provides tools to create, read, update, and delete diagram elements, enabling AI assistants to build architectural diagrams, flowcharts, and visual documentation automatically. It can be used with a built-in editor (server hosts Draw.io directly) or via a browser extension that connects to Draw.io running in the browser.

How to use Draw.io MCP server?

Configure the server in your MCP client (e.g., Claude Desktop, Claude Code, Zed, Codex, OpenCode) by adding a stdio command with npx -y drawio-mcp-server --editor. After restarting the host, open http://localhost:3000/ to access the built-in editor. Then prompt your AI assistant to create or modify diagrams. Alternatively, use the browser extension and run the server without the --editor flag.

Key features of Draw.io MCP server

• Built-in Draw.io editor – no browser extension required
• Import and export diagrams from/to XML, SVG, or PNG
• Multi‑document and multi‑page targeting with page selectors
• Page management tools: list, create, copy, rename pages
• Layer management for organizing complex diagrams
• Auto‑discovery of AWS, GCP, Azure, Cisco19, and CiscoSafe stencils
• Per‑document FIFO serialization for safe multi‑agent workflows
• Mermaid diagram import, embed, and expand support
• Optional TLS mode with self‑signed certificate generation

Use cases of Draw.io MCP server

• Automatically create event‑driven architecture diagrams with message queues and services
• Build multi‑page architecture diagrams using parallel agent workflows for different pages
• Generate CRUD API diagrams with databases, API gateways, and microservices
• Organize complex diagrams by adding layers and moving decorative elements to them
• Import existing diagrams from XML, SVG, or PNG for inspection and modification

FAQ from Draw.io MCP server

What are the differences between the built‑in editor and the browser extension?

The built‑in editor runs Draw.io directly inside the MCP server without extra requirements. The browser extension connects to Draw.io already open in your browser, allowing you to use your own editor instance.

What runtime dependencies are required?

Node.js v22 or higher (tested against v22 LTS and v24 LTS) and an MCP‑compatible host. The built‑in editor has no further dependencies; the browser extension requires installing the corresponding Chrome/Firefox add‑on.

Where are diagrams stored?

Diagrams live in the Draw.io editor session managed by the server. You can export them to XML, SVG, or PNG files using the available MCP tools.

Does the server support TLS connections?

Yes. The server offers an opt‑in TLS mode (HTTPS + WSS) that accepts manual certificate/key files or auto‑generates self‑signed material via a per‑user local CA.

Are there any known limitations with the desktop app?

Integration with the Draw.io Desktop (Electron) app is experimental and currently blocked by an upstream Content‑Security‑Policy issue that rejects the WebSocket connection to the MCP server.