Draw.io launches official MCP server – a surprisingly smooth AI‑powered diagram experience

Draw.io (renamed diagrams.net) announced an official MCP (Machine‑Code‑Protocol) server. The MCP tool, called drawio-mcp, does not draw diagrams on the backend; instead it instantly converts AI‑generated logic such as Mermaid, CSV, or XML into a Draw.io‑specific link.

How the workflow works

You ask an AI model, e.g., “draw an OAuth2 flow diagram”.

The AI returns structured data (Mermaid, CSV, or XML).

The MCP tool compresses and encodes the data.

The browser automatically opens a Draw.io editing page with a fully rendered, editable diagram.

Hands‑on in Cursor: installation and a real‑world example

1. Installation

The MCP server is published on npm. In Cursor’s Features → MCP settings, add a new MCP server entry:

{
  "mcpServers": {
    "drawio-mcp": {
      "command": "npx",
      "args": ["-y", "@drawio/mcp"]
    }
  }
}

A global installation can be configured similarly:

{
  "mcpServers": {
    "drawio-mcp": {
      "command": "drawio/mcp"
    }
  }
}

2. Real‑time diagram generation

After installation, without restarting, a prompt can be sent in the chat window:

“Use draw.io MCP tool open_drawio_mermaid to create an OAuth2 sequence diagram.”

Cursor interprets the intent, calls the open_drawio_mermaid tool, and the browser opens a new tab showing the complete, styled OAuth2 flow diagram.

The diagram is fully editable: nodes can be resized, colors changed, and custom logos dragged from the left‑hand asset library.

Supported conversion modes

Mermaid to diagram ( open_drawio_mermaid): AI writes Mermaid, Draw.io renders and allows further editing.

CSV to diagram ( open_drawio_csv): Ideal for org charts or network topologies; a list of names and reporting lines is turned into a tree diagram.

XML native format ( open_drawio_xml): Directly consumes existing Draw.io XML data for the most complex charts.

Technical limits

The MCP server is stateless; it creates a URL containing a compressed (Deflate) and Base64‑encoded representation of the diagram, e.g., https://app.diagrams.net/#create=…. Because all data resides in the URL, privacy is preserved – no server‑side storage is required.

However, the approach inherits browser URL‑length limits. Extremely large diagrams (e.g., 500‑node micro‑service architecture) may produce URLs that exceed the limit, causing truncation or failure to load.

Conclusion

By officially supporting MCP, Draw.io signals that traditional tool vendors are embracing the AI‑agent ecosystem. Instead of merely adding an AI assistant inside the product, they are positioning the product as a useful tool that AI agents can invoke. For developers, this means design documents and architecture diagrams can be generated instantly without manual drawing, streamlining workflow.

Reference: Draw.io MCP GitHub repository – https://github.com/jgraph/drawio-mcp