drawio-desktop-mcp

drawio-desktop-mcp

Enables AI agents to create and edit diagrams in the draw.io desktop app through the Model Context Protocol.

Category
Visit Server

README

About

drawio-desktop-mcp is a fork of drawio-desktop with a built-in MCP (Model Context Protocol) server that lets AI agents create and edit diagrams directly in the running desktop app.

drawio-desktop is a diagramming desktop app based on Electron that wraps the core draw.io editor.

MCP Server

The app includes an embedded MCP server on http://127.0.0.1:9100/mcp (Streamable HTTP transport) that starts automatically. Multiple AI agents can connect simultaneously and manipulate diagrams in real time.

Quick Start

# Clone (recursive for submodule)
git clone --recursive https://github.com/ArdaUzun/drawio-desktop-mcp.git
cd drawio-desktop-mcp

# Install and run
pnpm install
pnpm start

The MCP server starts automatically on port 9100.

Connect Claude Code

claude mcp add drawio-desktop --transport http http://127.0.0.1:9100/mcp --scope user

Or add a .mcp.json to your project:

{
  "mcpServers": {
    "drawio-desktop": {
      "type": "http",
      "url": "http://127.0.0.1:9100/mcp"
    }
  }
}

Available Tools (20)

Category Tools
Inspect get-diagram-info, get-diagram-screenshot, get-selected-cell, list-paged-model
Shapes add-rectangle, add-cell-of-shape, edit-cell, delete-cell-by-id
Edges add-edge, edit-edge
Shape Library get-shape-categories, get-shapes-in-category, get-shape-by-name, set-cell-shape
Layers list-layers, get-active-layer, set-active-layer, create-layer, move-cell-to-layer
Data set-cell-data

Health Check

curl http://127.0.0.1:9100/health
# {"status":"ok","tools":20,"windows":1,"pending":0}

Flatpak Install

# Build unpacked electron app
pnpm run build:dir
pnpm run build:flatpak-prep

# Build and install Flatpak (requires flatpak-builder + org.electronjs.Electron2.BaseApp//24.08)
flatpak-builder --user --install --force-clean build-flatpak flatpak/com.jgraph.drawio.desktop.yml
flatpak run com.jgraph.drawio.desktop//master

Configuration

Setting CLI Flag Env Var Default
MCP Port --mcp-port <n> DRAWIO_MCP_PORT 9100

Updating from Upstream

git fetch upstream
git merge upstream/dev
git push origin dev

Download built binaries from the releases section.

Can I use this app for free? Yes, under the apache 2.0 license. If you don't change the code and accept it is provided "as-is", you can use it for any purpose.

Security

draw.io Desktop is designed to be completely isolated from the Internet, apart from the update process. This checks github.com at startup for a newer version and downloads it from an AWS S3 bucket owned by Github. All JavaScript files are self-contained, the Content Security Policy forbids running remotely loaded JavaScript.

No diagram data is ever sent externally, nor do we send any analytics about app usage externally. There is a Content Security Policy in place on the web part of the interface to ensure external transmission cannot happen, even by accident.

Security and isolating the app are the primarily objectives of draw.io desktop. If you ask for anything that involves external connections enabled in the app by default, the answer will be no.

Support

Support is provided on a reasonable business constraints basis, but without anything contractually binding. All support is provided via this repo. There is no private ticketing support for non-paying users.

Purchasing draw.io for Confluence or Jira does not entitle you to commercial support for draw.io desktop.

Developing

draw.io is a git submodule of drawio-desktop. To get both you need to clone recursively:

git clone --recursive https://github.com/jgraph/drawio-desktop.git

To run this:

  1. npm install (in the root directory of this repo)
  2. [internal use only] export DRAWIO_ENV=dev if you want to develop/debug in dev mode.
  3. npm start in the root directory of this repo runs the app. For debugging, use npm start --enable-logging.

Note: If a symlink is used to refer to drawio repo (instead of the submodule), then symlink the node_modules directory inside drawio/src/main/webapp also.

To release:

  1. Update the draw.io sub-module and push the change. Add version tag before pushing to origin.
  2. Wait for the builds to complete (https://travis-ci.org/jgraph/drawio-desktop and https://ci.appveyor.com/project/davidjgraph/drawio-desktop)
  3. Go to https://github.com/jgraph/drawio-desktop/releases, edit the preview release.
  4. Download the windows exe and windows portable, sign them using signtool sign /a /tr http://rfc3161timestamp.globalsign.com/advanced /td SHA256 c:/path/to/your/file.exe
  5. Re-upload signed file as draw.io-windows-installer-x.y.z.exe and draw.io-windows-no-installer-x.y.z.exe
  6. Add release notes
  7. Publish release

Note: In Windows release, when using both x64 and is32 as arch, the result is one big file with both archs. This is why we split them.

Local Storage and Session Storage is stored in the AppData folder:

  • macOS: ~/Library/Application Support/draw.io
  • Windows: C:\Users\<USER-NAME>\AppData\Roaming\draw.io\

Not open-contribution

draw.io is closed to contributions (unless a maintainer permits it, which is extremely rare).

The level of complexity of this project means that even simple changes can break a lot of other moving parts. The amount of testing required is far more than it first seems. If we were to receive a PR, we'd have to basically throw it away and write it how we want it to be implemented.

We are grateful for community involvement, bug reports, & feature requests. We do not wish to come off as anything but welcoming, however, we've made the decision to keep this project closed to contributions for the long term viability of the project.

Recommended Servers

playwright-mcp

playwright-mcp

A Model Context Protocol server that enables LLMs to interact with web pages through structured accessibility snapshots without requiring vision models or screenshots.

Official
Featured
TypeScript
Magic Component Platform (MCP)

Magic Component Platform (MCP)

An AI-powered tool that generates modern UI components from natural language descriptions, integrating with popular IDEs to streamline UI development workflow.

Official
Featured
Local
TypeScript
Audiense Insights MCP Server

Audiense Insights MCP Server

Enables interaction with Audiense Insights accounts via the Model Context Protocol, facilitating the extraction and analysis of marketing insights and audience data including demographics, behavior, and influencer engagement.

Official
Featured
Local
TypeScript
VeyraX MCP

VeyraX MCP

Single MCP tool to connect all your favorite tools: Gmail, Calendar and 40 more.

Official
Featured
Local
graphlit-mcp-server

graphlit-mcp-server

The Model Context Protocol (MCP) Server enables integration between MCP clients and the Graphlit service. Ingest anything from Slack to Gmail to podcast feeds, in addition to web crawling, into a Graphlit project - and then retrieve relevant contents from the MCP client.

Official
Featured
TypeScript
Kagi MCP Server

Kagi MCP Server

An MCP server that integrates Kagi search capabilities with Claude AI, enabling Claude to perform real-time web searches when answering questions that require up-to-date information.

Official
Featured
Python
E2B

E2B

Using MCP to run code via e2b.

Official
Featured
Neon Database

Neon Database

MCP server for interacting with Neon Management API and databases

Official
Featured
Exa Search

Exa Search

A Model Context Protocol (MCP) server lets AI assistants like Claude use the Exa AI Search API for web searches. This setup allows AI models to get real-time web information in a safe and controlled way.

Official
Featured
Qdrant Server

Qdrant Server

This repository is an example of how to create a MCP server for Qdrant, a vector search engine.

Official
Featured