This repository holds the official draw.io Model Context Protocol (MCP) integrations, which let a model generate a diagram and open or render it in draw.io. Four paths are offered, and they differ in where the diagram appears and what has to be installed: an MCP app server, an MCP tool server, plugins for coding assistants, and a set of project instructions that need no server at all.
The MCP app server renders diagrams inline in a chat interface as interactive iframes using the MCP Apps extension. It is available as a hosted endpoint at https://mcp.draw.io/mcp, can be run locally with Node.js, or deployed to Cloudflare Workers. It exposes creatediagram, which renders draw.io XML, and searchshapes, which searches an index of more than 10,000 shapes across the draw.io libraries — AWS, Azure, GCP, P&ID, electrical, Cisco, Kubernetes, UML, BPMN, and others — and falls back to the draw.io icon service when the local index has no strong match, returning style strings you can use directly in XML.
The MCP tool server, published as @drawio/mcp on npm, opens the diagram in the draw.io editor in a browser tab instead, and accepts XML, CSV, and Mermaid input with lightbox and dark-mode options. The assistant plugins generate native .drawio files locally and can export PNG, SVG, or PDF with the diagram XML embedded through a locally installed draw.io Desktop CLI, or open a compressed diagram URL at app.diagrams.net.
Two optional layout passes can run after generation: ELK auto-layout rearranges nodes into a layered layout and routes its own edges, while libavoid keeps node positions and reroutes connectors orthogonally around the shapes. Which pass is available depends on the path you use, and Mermaid diagrams are already laid out, so neither applies to them.
Documented data-residency behaviour states where diagram content goes for each path: the hosted app server receives the diagram as the MCP request, while the self-hosted app server, the tool server (which carries the diagram in a URL fragment), and the plugins keep it on the machine. No component calls a cloud rasterizer. Rendering still loads viewer code from app.diagrams.net and viewer.diagrams.net by default, which the VIEWERPATH build variable and the DRAWIOBASE_URL environment variable can remove.
Features
- Inline rendering: the app server returns interactive diagrams inside the conversation for hosts that support MCP Apps, and falls back to XML text elsewhere
- Editor hand-off: the tool server opens generated diagrams directly in the draw.io editor, with lightbox and dark-mode options
- Input formats: XML everywhere, plus CSV and Mermaid on the tool server and the project-instructions path
- Shape search: a prebuilt index of over 10,000 shapes returns exact style strings, supplemented live by the draw.io icon service
- Assistant plugins: the same drawio skill installs into Claude Code, Codex CLI, and GitHub Copilot from one marketplace repository
- Local export: PNG, SVG, and PDF exports embed the diagram so the exported file stays editable in draw.io
- Layout passes: ELK auto-layout for node placement, libavoid for orthogonal connector routing
- Self-hosting: the app server runs locally or on your own Cloudflare account; the tool server accepts a self-hosted draw.io base URL
- Data-residency documentation: a per-path statement of whether the diagram leaves the machine, and how to reduce outbound requests
- Single XML reference: one canonical generation reference feeds every path's prompts, so guidance updates propagate automatically
- Maintained shape index: the committed search index is regenerated from the live draw.io client on every release by a scheduled workflow
