What it does
This MCP server generates diagrams from Claude and opens them directly in the draw.io editor. It accepts XML, CSV, and Mermaid.js input formats, passes diagram data through URL fragments to keep it local, and renders the result in a new browser tab. Built-in options support lightbox display mode and dark mode rendering. The server does not transmit diagram content to external rendering services — all processing happens client-side in your browser.
Who it's for
Engineers and architects using Claude Desktop who need to author diagrams with AI assistance and then edit them interactively. Particularly useful for those working under data-residency constraints or who prefer the native draw.io editor over inline previews.
Common use cases
- Generate cloud architecture diagrams with AWS, Azure, GCP, and Kubernetes shapes; refine visually in draw.io.
- Convert Mermaid syntax to richer, more customizable draw.io format with additional styling options.
- Author UML class diagrams, flowcharts, or entity-relationship diagrams with Claude, then iterate and polish them live.
- Build system designs under data-residency requirements where diagram XML never leaves your machine.
Setup pitfalls
- Install via
npx @drawio/mcp; requires Node.js and npm on the host. - Diagram data is URL-encoded and embedded in browser fragments; extremely large diagrams may exceed URL length limits.
- Writes diagram files to the local filesystem; ensure the working directory has write permissions.
- Requires a graphical browser with JavaScript enabled; will not function in headless or terminal-only environments.