Log inSubmit server
Draw.io logo

Draw.io

Creates editable draw.io diagrams from XML, CSV, or Mermaid through MCP, with browser, inline, and local file workflows.

InstallRepositoryWebsite
Full README Compare alternatives Embed widget Claim this listing

Install Draw.io

Pick your client, then add it in one click or paste the config.

STDIONode.js
~/Library/Application Support/Claude/claude_desktop_config.json
claude_desktop_config.json
{
  "mcpServers": {
    "draw-io": {
      "command": "npx",
      "args": [
        "-y",
        "@drawio/mcp"
      ]
    }
  }
}

Settings → Developer → Edit Config, merge this into mcpServers, then fully quit and reopen Claude Desktop.

Automated check passed— started and listed 8 tools correctly (Today).

Overview

The draw.io MCP server connects AI assistants to the draw.io editor and diagram formats including XML, CSV, and Mermaid.js. Its hosted MCP App endpoint renders interactive diagrams inline in compatible chats, while the npm-based tool server opens diagrams in a browser tab. Additional tools search draw.io’s shape libraries and manage pages in local .drawio files. Reach for draw.io when an agent needs to generate, inspect, edit, or present diagrams rather than return static text.

Use cases

  • Generate editable architecture diagrams from prompts
  • Open Mermaid flowcharts in the draw.io editor
  • Search specialized draw.io shapes for infrastructure diagrams
  • Inspect and update pages in local .drawio files
  • Export generated diagrams through assistant plugins

Key features

  • XML, CSV, and Mermaid diagram input
  • Interactive inline rendering through MCP Apps
  • Browser-based draw.io editor workflow
  • Search across approximately 10,000 shapes
  • Local .drawio page inspection and replacement
  • Optional PNG, SVG, and PDF plugin exports

Tools8

What Draw.io lets your agent do. Expand a tool for its parameters.

Verified live~2.6k tokens of context

Security & health

What it can reach and how reliably it runs — from our own checks, not the maintainer’s claims.

ActiveLast checked Today

Recent health check succeeded.

52/56 checks healthy over the last 92d

What it can do

From the 8 tools this server returned when we ran it.

Read-only tools · 8
Network at startup3 connections
Files written at startupNone
Install scriptspostinstall
npm provenanceSigned build
Package age280 days
Maintainers1

Observed 2026-11-10 in an isolated sandbox. A description of reach, not a security audit.

Supply-chain signal

No high-severity advisories surfaced by our automated scan.

Critical 0High 0Medium 0Low 0

Scanned 4d ago via OSV.dev · @drawio/mcp (npm)

Adoption & maintenance

Factual signals from GitHub, npm, and our automated checks — not a rating.

GitHub stars5.8kStargazers on the source repository.
npm downloads128kPackage downloads in the last 30 days.
Last commitTodayMost recent push to the default branch.
Availability100%Our rolling endpoint + install checks that succeeded.
Install checkPassedOur sandbox started it and listed its tools.
Tools exposed8Callable tools this server registers over MCP.
Directory activity13 viewsConfig copies, upvotes, and views on AllMCPs.

How Draw.io works

What draw.io MCP server does

draw.io MCP server lets AI assistants create and open editable diagrams in draw.io. It accepts draw.io XML, CSV following draw.io’s import format, and Mermaid.js syntax. Mermaid support covers diagram types such as flowcharts, sequence diagrams, class diagrams, state diagrams, entity-relationship diagrams, timelines, mind maps, architecture diagrams, and other supported Mermaid formats.

The repository provides several delivery modes. The hosted MCP App endpoint renders diagrams as interactive content inside compatible AI chat interfaces. The npm MCP tool server opens diagrams in the draw.io editor, while assistant plugins can generate native .drawio files and optionally export PNG, SVG, or PDF files. A project-instructions approach can generate browser links without installing an MCP server.

How it works

For inline rendering, connect an MCP-compatible host to https://mcp.draw.io/mcp. The server’s diagram tool receives XML or Mermaid and produces an interactive viewer, with an option to open the result in draw.io. Hosts without MCP Apps support can still receive a link to the diagram.

For the local editor workflow, run the published npm package with npx @drawio/mcp. The tool server accepts XML, CSV, and Mermaid input and opens the resulting diagram in a new browser tab. Local file tools operate on .drawio files: list_pages identifies pages, get_page reads one page’s raw model, and set_page replaces a selected page while preserving other pages.

Setup and configuration

Use the hosted endpoint when the client supports remote MCP servers and MCP Apps; this requires no local installation. The repository names Claude.ai, ChatGPT, VS Code with GitHub Copilot, Cursor, and GitHub Copilot CLI as compatible hosted environments. GitHub Copilot CLI uses an HTTP MCP registration command and returns links rather than inline diagrams in its terminal.

For the original editor-opening server, install through npm execution:

Terminal
npx @drawio/mcp

Setup guidance is provided for Claude Desktop, Claude Code, VS Code with GitHub Copilot, Cursor, and OpenCode. The repository also offers a Docker image and supports deploying a local instance to Cloudflare Workers.

Tools and capabilities

  • Create diagrams from XML or Mermaid with create_diagram in the hosted MCP App server.
  • Open XML, CSV, or Mermaid diagrams in draw.io with the MCP tool server.
  • Search roughly 10,000 draw.io shapes and receive reusable style strings with search_shapes.
  • Retrieve XML or Mermaid generation guidance with get_drawio_reference.
  • List, read, and replace pages in local .drawio files.
  • Generate native .drawio files through the assistant plugins, with optional PNG, SVG, PDF, or browser-URL output.

Shape search covers libraries for cloud architecture, networking, P&ID, electrical diagrams, Cisco, Kubernetes, UML, BPMN, and other specialized notation. It can also consult the draw.io icon service for brand and general-purpose icons.

Limitations and notes

Inline rendering depends on MCP Apps support in the host. GitHub Copilot CLI can use the hosted server but displays a link instead of an inline diagram. PNG, SVG, and PDF export from the assistant plugins requires draw.io Desktop; browser URL output does not require Desktop. Mermaid diagrams are converted through draw.io’s Mermaid support, while exact positioning, native draw.io shapes, and complex layered diagrams are better represented with XML.

Read the full README View source on GitHub

Reviews

No reviews yet — be the first to share how it worked for you.

Frequently Asked Questions about Draw.io

draw.io is an MCP server that connects AI assistants to the draw.io editor and diagram formats including XML, CSV, and Mermaid. Its main tools create or open diagrams, search roughly 10,000 shapes, return generation references, and inspect or replace pages in local .drawio files.

Run `npx @drawio/mcp` to use the local editor-opening MCP tool server. The hosted MCP App endpoint at `https://mcp.draw.io/mcp` requires no installation and can be added as a remote MCP server in compatible hosts.

Yes, draw.io works with Cursor. Cursor can connect to the hosted MCP App endpoint for inline diagrams, and the repository also provides setup options for the local npm tool server and a Cursor plugin.

Yes, draw.io can create diagrams from Mermaid.js syntax. Supported examples include flowcharts, sequence, class, state, entity-relationship, timeline, mind map, architecture, and other Mermaid diagram types.

Yes, its local-file tools can list pages, read a page’s raw mxGraphModel XML, and replace one page while leaving the other pages untouched. Use `list_pages` first when selecting a page from a large multi-page file.

Related MCP servers

All in Data Visualization All alternatives
Add a badge to your READMEShow it’s listed — live SVG, Markdown or HTML.

AllMCPs Directory Badge

Full Badge Customizer

Showcase your server listing on GitHub or your project documentation. Embed this dynamic SVG badge to highlight official listing status and live engagement.

Badge Style:
Live Dynamic SVG PreviewDraw.io AllMCPs Directory Badge
Markdown (GitHub README)
[![AllMCPs](https://allmcps.com/api/badge/draw-io?style=directory)](https://allmcps.com/mcp/draw-io)
HTML Embed
<a href="https://allmcps.com/mcp/draw-io"><img src="https://allmcps.com/api/badge/draw-io?style=directory" alt="Draw.io on AllMCPs" /></a>