Smart Drawio MCP
Smart Drawio Next
An MCP server and skill for editable draw.io diagrams: an agent generates XML from a prompt, validates references, repairs tags and applies themes
- 367 ★ on the repository
- Last commit
- MIT
Extended access
Why this level
- Runs a local Node.js process through npx that sends requests to a model provider with your key when generating
- The API key is passed through the MCP process environment variables
Install
- Works in
In your terminal, with SkillFoxx CLI
npx skillfoxx add mcp/smart-drawio-nextDetects the agents on your machine, shows the access level and pins the version.
Other ways to install
Access and checks
How we reviewExtended accessThe tool runs code or makes network calls and only reads external data.
- Runs a local Node.js process through npx that sends requests to a model provider with your key when generating
- The API key is passed through the MCP process environment variables
This is third-party code. Review the repository files before installing.
What it does
Smart Drawio Next is a repository with three entry points to one task: a Next.js website, the smart-drawio skill and the local smart-drawio MCP server. The site accepts text or a reference image, streams a draw.io diagram and lets you edit the XML in an editor beside an embedded canvas. The skill walks an agent through creating, editing, checking and saving editable diagrams, uses the agent's own model, and its Python 3 validator works offline with no third-party dependencies. The MCP server starts over stdio through npx and provides five tools. generate_drawio builds complete validated XML from a text prompt and is the only one that needs model settings. validate_drawio checks syntax, IDs, parents and references. repair_drawio conservatively repairs missing closing tags. style_drawio applies themes, style packs, presets and drawing tricks. list_drawio_options lists supported diagram types, themes and options. There are more than twenty diagram types: flowcharts, mind maps, org charts, sequence diagrams, UML, ER, Gantt charts, architecture diagrams and more. Ten color themes are built in, along with drawing tricks such as orthogonal routing and grid snap, and style presets. The MCP returns uncompressed XML for the client to save as a .drawio file, while PNG, SVG and PDF export needs an available draw.io renderer.
Who it is for. For researchers, technical writers and developers who ask an agent to draw architecture and scientific diagrams and want an editable draw.io file rather than a picture.
Good fit when
- You need an architecture diagram or a scientific figure such as a transformer's encoder and decoder as a .drawio file you can edit by hand
- The agent produced XML with errors and you want to check syntax, IDs and references with validate_drawio
- A finished diagram needs another theme or a style pack applied without redrawing it
- You want to upload a reference picture and get an editable diagram from it on the website
- You need a skill that runs on the agent's own model with no separate provider setup
Not a fit when
- You need to control a live draw.io canvas from an agent: version 0.1.0 has only local stdio tools, with no remote MCP endpoint or live session control
- You need ready PNG, SVG or PDF export without draw.io installed: previews and exports need a draw.io renderer or editor
- You want MCP generation without a model key: generate_drawio requires a provider and model, while the other four tools need no key
- You only need Mermaid or PlantUML: the project works with the draw.io format
Example request
Use smart-drawio to create an original encoder–decoder Transformer diagram, save it as transformer.drawio and check its connectors and labelsMCP
- Transport
- stdio
- Authentication
- key is optional
Environment variables
SMART_DRAWIO_PROVIDER- Type of OpenAI- or Anthropic-compatible model provider, needed only for generate_drawio
SMART_DRAWIO_BASE_URL- Model provider API base URL
SMART_DRAWIO_API_KEYsecret- Provider API key, needed only for generate_drawio
SMART_DRAWIO_MODEL- Model name used for diagram generation
Limitations
- MCP needs Node.js 20.9 or newer and a client with local stdio. Only generate_drawio requires the SMART_DRAWIO_PROVIDER, SMART_DRAWIO_BASE_URL, SMART_DRAWIO_API_KEY and SMART_DRAWIO_MODEL variables for an OpenAI- or Anthropic-compatible provider.
- The server returns uncompressed XML and the client must save the file. PNG, SVG and PDF export needs a draw.io renderer.
- There is no remote HTTP MCP endpoint and no live canvas control.
- The skill is distributed as GitHub files with no separate npm package and installs through the Skills CLI.
- The author gives an example whose original output has an annotation crossed by a connector and keeps such outputs as they are. Diagram quality depends on the model.
- The Vercel-hosted site requires your own API key.
How to disable. Remove the smart-drawio block from the MCP client config and restart the client. The skill is removed along with the smart-drawio folder in the agent's skills directory. Already saved .drawio files stay as ordinary documents.
FAQ
How do I connect Smart Drawio as an MCP server?
Add a smart-drawio server to the client config with the npx command and the arguments -y and @yunshenwuchuxun/smart-drawio-mcp@0.1.0. Node.js 20.9 or newer is needed. The client starts the server itself and talks to it over stdin and stdout.
How do I install the smart-drawio skill?
Run npx skills add https://github.com/yunshenwuchuxun/smart-drawio-next/tree/tools-v0.1.0/skills/smart-drawio. The skill is distributed as GitHub files with no separate npm package, and a ZIP of version 0.1.0 sits in the repository release. It uses the agent's own model.
Which tools work without a key?
Four of the five tools need no model: validate_drawio, repair_drawio, style_drawio and list_drawio_options. A key and provider address are needed only for generate_drawio. The server returns uncompressed XML to save as a .drawio file.
Which diagram types does Smart Drawio make?
More than twenty, including flowchart, mind map, org chart, sequence diagram, UML class, ER, Gantt chart, network topology, architecture diagram, SWOT and Venn diagram. You can name the type explicitly or leave it to the model.
How is Smart Drawio different from other draw.io MCP servers?
It bundles a website, a skill and a server: XML is generated and validated locally, and there is no live canvas control or remote MCP endpoint. Other servers exist for working with an open draw.io canvas, while here the stress is on checking, repairing and styling the file.
Discussion
No questions or reviews yet.
Related
MCP serversThe official draw.io MCP server: an agent builds diagrams from XML or Mermaid and opens them in the draw.io editor
Next AI Draw.io is an MCP server and plugin where the agent draws draw.io diagrams on a live browser canvas that you can edit by hand
A Codex plugin that redraws a scientific figure from a reference on the live draw.io canvas step by step, then validates and exports the file
Draw.io Skill
Draw.io Skill for Claude & Codex
Skills for draw.io diagrams: architecture, networks, flowcharts, import from Terraform and code, offline generation from YAML and PNG and SVG export
A skill for editable draw.io diagrams from text, code, Terraform, Kubernetes, SQL and OpenAPI, with export and self-checks
A skill that draws editorial diagrams as standalone HTML and SVG files: architecture, flowcharts, ER, funnels and about forty more types
Comparison with similar tools
Cards that share the main search query, and how they differ.
| Tool | Official | Authentication | Repository stars | Main difference |
|---|---|---|---|---|
| Smart Drawio (this card) | no | key is optional | 367 | |
| Draw.io MCP Server | yes | not required | 5,777 | an MCP server where the agent builds and edits diagrams on a live draw.io canvas, with layers and pages |
| Draw.io Skill | no | 299 | skills for draw.io: architecture, networks, flowcharts and Terraform import | |
| Next AI Draw.io | no | 36,682 | a plugin and MCP server where the agent draws draw.io diagrams on a live canvas |
README in short
The README presents the project as a generator of editable draw.io diagrams and tabulates three entry points: the site, the skill and the MCP server. It then covers skill installation, MCP setup with a tool table, examples, supported diagram types, themes and post-processing systems, plus site deployment and release test results.