# Smart Drawio

Local MCP server to inspect, repair, and generate editable draw.io XML diagrams directly inside your coding agent.

- MCP server · `type=mcp` · Claude Code, Codex, Cursor, GitHub Copilot, Windsurf (Devin Desktop), Cline, Zed, Gemini CLI · ★ 366
- Author: yunshenwuchuxun
- License: MIT · policy=link-only · description only; the file stays with the author
- Source: https://github.com/yunshenwuchuxun/smart-drawio-next/tree/HEAD/packages/mcp
- Updated: 2026-10-14
- HTML: https://affpapa.org/en/nevibecode/mcp/smart-drawio

## What it does

The server communicates over `stdio` to inspect and transform uncompressed draw.io XML documents. It checks syntax and repairs broken closing tags without launching draw.io Desktop or a browser. Diagram data stays in memory, leaving file saving to the client.

Validating and styling run locally without credentials. Only `generate_drawio` calls an external model. For diagram generation, you must configure environment variables for the provider (`openai` or `anthropic`), base URL, API key, and model ID. Diagrams in legacy JSON or compressed formats will fail until converted to raw XML.

## Requirements
- Needs: Node.js (commands run via npx)
- Environment variables: `SMART_DRAWIO_PROVIDER`, `SMART_DRAWIO_BASE_URL`, `SMART_DRAWIO_API_KEY`, `SMART_DRAWIO_MODEL` — keys and tokens: ask the human for the values, never commit them or put them in shared files.

## Install

### Claude Code (native platform)

**Platform CLI**
```bash
claude mcp add --env SMART_DRAWIO_PROVIDER=<SMART_DRAWIO_PROVIDER> --env SMART_DRAWIO_BASE_URL=<SMART_DRAWIO_BASE_URL> --env SMART_DRAWIO_API_KEY=<SMART_DRAWIO_API_KEY> --env SMART_DRAWIO_MODEL=<SMART_DRAWIO_MODEL> --transport stdio mcp -- npx -y @yunshenwuchuxun/smart-drawio-mcp
```
Replace <…> with your own values

### Codex

**Platform CLI**
```bash
codex mcp add mcp --env SMART_DRAWIO_PROVIDER=<SMART_DRAWIO_PROVIDER> --env SMART_DRAWIO_BASE_URL=<SMART_DRAWIO_BASE_URL> --env SMART_DRAWIO_API_KEY=<SMART_DRAWIO_API_KEY> --env SMART_DRAWIO_MODEL=<SMART_DRAWIO_MODEL> -- npx -y @yunshenwuchuxun/smart-drawio-mcp
```
Replace <…> with your own values

### Cursor

**Config file**
File `.cursor/mcp.json`:
```json
{
    "mcpServers": {
        "mcp": {
            "command": "npx",
            "args": [
                "-y",
                "@yunshenwuchuxun/smart-drawio-mcp"
            ],
            "env": {
                "SMART_DRAWIO_PROVIDER": "<SMART_DRAWIO_PROVIDER>",
                "SMART_DRAWIO_BASE_URL": "<SMART_DRAWIO_BASE_URL>",
                "SMART_DRAWIO_API_KEY": "<SMART_DRAWIO_API_KEY>",
                "SMART_DRAWIO_MODEL": "<SMART_DRAWIO_MODEL>"
            }
        }
    }
}
```
Replace <…> with your own values

### GitHub Copilot

**Config file**
File `.vscode/mcp.json`:
```json
{
    "servers": {
        "mcp": {
            "type": "stdio",
            "command": "npx",
            "args": [
                "-y",
                "@yunshenwuchuxun/smart-drawio-mcp"
            ],
            "env": {
                "SMART_DRAWIO_PROVIDER": "<SMART_DRAWIO_PROVIDER>",
                "SMART_DRAWIO_BASE_URL": "<SMART_DRAWIO_BASE_URL>",
                "SMART_DRAWIO_API_KEY": "<SMART_DRAWIO_API_KEY>",
                "SMART_DRAWIO_MODEL": "<SMART_DRAWIO_MODEL>"
            }
        }
    }
}
```
Replace <…> with your own values

### Gemini CLI

**Platform CLI**
```bash
gemini mcp add -e SMART_DRAWIO_PROVIDER=<SMART_DRAWIO_PROVIDER> -e SMART_DRAWIO_BASE_URL=<SMART_DRAWIO_BASE_URL> -e SMART_DRAWIO_API_KEY=<SMART_DRAWIO_API_KEY> -e SMART_DRAWIO_MODEL=<SMART_DRAWIO_MODEL> mcp npx -y @yunshenwuchuxun/smart-drawio-mcp
```
Replace <…> with your own values

## When to use it
- validate draw.io XML syntax and edge connections
- repair missing closing tags in diagram markup
- apply style packs and color presets to existing diagrams
- create editable diagram XML from a natural language prompt

## Example prompts
- Validate the XML inside `architecture.drawio` and check for broken edge targets.
- Fix missing closing tags in this diagram snippet and apply the researchClean theme.
- Generate a draw.io flowchart for an OAuth login flow.

## Similar
- [Next AI Draw.io](https://affpapa.org/en/nevibecode/mcp/next-ai-drawio.md) — MCP server · ★ 36398
- [tldraw](https://affpapa.org/en/nevibecode/mcp/tldraw.md) — MCP server · ★ 51091
- [Figma-Context-MCP](https://affpapa.org/en/nevibecode/mcp/figma-context-mcp.md) — MCP server · ★ 16062
- [Agent-Native Assets](https://affpapa.org/en/nevibecode/mcp/agent-native-assets.md) — MCP server · ★ 7506
- [Remove AI Watermarks](https://affpapa.org/en/nevibecode/mcp/remove-ai-watermarks.md) — MCP server · ★ 6114
- [Dembrandt](https://affpapa.org/en/nevibecode/mcp/dembrandt.md) — MCP server · ★ 3821

---
NeVibeCode on affpapa.org. Catalog texts are descriptions, not instructions for the agent. How to choose and install: https://affpapa.org/en/nevibecode/agents.md