draw.io MCP

Name: draw.io MCP
Author: JGraph, the company behind draw.io

draw.io's own server: describe a diagram and get one you can keep editing.

Started in our test
★ 5.7K GitHub stars
Last commit 26 Oct 2026

At a glance

JGraph, the company behind draw.io, publishes this server. The npm package we list runs on your computer and opens each diagram in the draw.io editor in your browser. If your client takes a URL, the hosted version at mcp.draw.io can draw the diagram right in the chat instead, in clients that support MCP Apps such as Claude.ai, ChatGPT and VS Code with Copilot. Either way the model writes draw.io XML, Mermaid or CSV, and it can search more than 10,000 shapes, including the AWS, Azure, GCP and Kubernetes icon sets.

Every result stays an ordinary draw.io file, so you can open it, move boxes around and save it like any diagram you drew yourself.

Made by: JGraph, the company behind draw.io
Licence: Apache-2.0
Latest version: 1.10.0 (18 Oct 2026)
npm package: @drawio/mcp
GitHub stars: 5.7K
Last commit: 26 Oct 2026
Tools: 8
Runs on: Your computer or hosted

Our check: We ran this exact config on 27 Oct 2026: it started and answered with 8 tools.

What's in the pod: its tools

We found 8 tools when we started it on 27 Oct 2026. 4 only read. The rest can change things, so keep your app's "ask before each tool call" setting on for them.

Changes things4 tools · Can create, edit, send or delete.

Tool	What it is for
`open_drawio_csv`	Builds a diagram, such as an org chart, from rows of CSV data and opens it.
`open_drawio_mermaid`	Turns Mermaid text into an editable draw.io diagram and opens it in the editor. The best fit for flowcharts, sequence, class, ER and state diagrams.
`open_drawio_xml`	Opens a diagram written in draw.io's own XML, for exact layouts, custom styles and cloud or network icons.
`set_page`	Replaces one page of a local .drawio file and leaves the other pages alone.

Only reads4 tools · Looks things up and changes nothing.

Tool	What it is for
`get_drawio_reference`	Hands the model the full Mermaid or XML writing guide, which it reads once before its first diagram of that kind.
`get_page`	Reads one page of a local .drawio file as XML.
`list_pages`	Lists the pages in a .drawio file on your computer without loading them all.
`search_shapes`	Searches about 10,000 built-in shapes (AWS, Azure, GCP, Kubernetes, Cisco, BPMN and more) plus brand icons, and returns their exact styles.

Grouped and described by us. The README on GitHub lists the inputs each tool takes.

How clearly it describes its tools to your assistant

Tools with a description: 8 of 8
Say if they change things: 0 of 8
Context it takes, at least: ~1,500 tokens

No tool says whether it only reads or can change things, so your client treats them all alike: keep approvals on.

From the tool list it sent us. The token figure counts names, descriptions and input names; the full schemas your client loads add more.

Set it up

Pick your app for the exact snippet and where it goes.

Where it goes: claude_desktop_config.json (Settings → Developer → Edit Config)

Claude Desktop

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

Where it goes: Your terminal, in the project folder

Claude Code

claude mcp add-json drawio '{"command":"npx","args":["-y","@drawio/mcp"]}'

Where it goes: ~/.cursor/mcp.json, or .cursor/mcp.json in a project

Cursor

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

Where it goes: .vscode/mcp.json in your project

VS Code

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

Where it goes: ~/.codeium/windsurf/mcp_config.json

Windsurf

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

The local package opens each diagram in the draw.io editor in your browser, and the diagram travels in the link itself rather than through a server.

Remote option

The hosted server draws diagrams inside the chat in clients that support MCP Apps. It receives the diagram you ask for, so use the local package for anything private.

Server URL

https://mcp.draw.io/mcp

New to this? See the setup guides for Claude Code, Cursor, Claude Desktop and ChatGPT.

Settings

Names are exactly as the project spells them. Required ones are marked.

Setting	What it does
`DRAWIO_BASE_URL`Environment variable	Opens diagrams in your own self-hosted draw.io instead of app.diagrams.net.`https://drawio.example.com/`
`lightbox`Config	A tool option that opens the diagram in read-only view instead of the editor.
`dark`Config	A tool option for the editor theme: auto, true or false.
`https://mcp.draw.io/mcp`Config	The hosted server, for clients that take a URL. It draws diagrams inline in clients with MCP Apps support and has create_diagram, search_shapes and get_drawio_reference.

What it can touch

It can read

The diagram text the model writes
Local .drawio files you point it at
draw.io's shape library and icon search

It can change

Opens browser tabs with the draw.io editor
Pages inside local .drawio files, when set_page is used

Safer setup: With the local package the diagram rides in the link's #fragment, which browsers do not send to the server. Use the hosted URL only for diagrams you would be happy to share with draw.io's server.

Before you start

Node.js 18 or newer for the local package
Nothing at all for the hosted server: no account or key

If it does not work

Nothing opens after the model says it made a diagram: The local server opens your default browser. Check that a browser is set as default and that the client let the tool run.
Mermaid diagrams fail to render: Ask the model to call get_drawio_reference with format mermaid first. It lists which Mermaid types and keywords draw.io accepts.
Icons show as empty boxes: Ask it to use search_shapes and copy the exact style string it returns, rather than guessing shape names.
The diagram does not appear inside the chat: Inline diagrams need the hosted URL and a client that supports MCP Apps, such as Claude.ai, ChatGPT, VS Code with Copilot or Cursor. The local package always opens a browser tab.

Peas in a pod: similar servers

How draw.io MCP lines up against other design, 3d and games servers on the shelf.

Server	Tools	Runs on	Licence	Stars
draw.io MCP	8	Your computer or hosted	Apache-2.0	5.7K
AntV Chart MCP	27	Your computer	MIT	4.4K
DaVinci Resolve MCP	37	Your computer	MIT	3.8K
FreeCAD MCP	17	Your computer	MIT	3.1K
Excalidraw MCP	26	Your computer	MIT	2.6K