Smart Drawio — Claude Code MCP server: what it does, how to install
Local MCP server to inspect, repair, and generate editable draw.io XML diagrams directly inside your coding agent.
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-mcpWhat Smart Drawio 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.
What it helps with
- 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 for the agent
- Validate the XML inside
architecture.drawioand 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.
How to install Smart Drawio
Platform CLI
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-mcpReplace <…> with your own values
Platform CLI
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-mcpReplace <…> with your own values
Config file
{
"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
Config file
{
"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
Platform CLI
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-mcpReplace <…> with your own values
Step by step, with commands for each platform: How to add an MCP server to Claude Code, Codex, Cursor, VS Code, Gemini CLI and more
Questions about Smart Drawio
How do I install Smart Drawio in Claude Code?
Run `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`. Node.js 20.9 or newer is required.
Do I need API keys to use Smart Drawio?
No keys are needed for validation, repair, and restyling tools. API credentials and model settings are only needed if you call generate_drawio.
Can this server render PNG or PDF previews?
No, the server works exclusively with diagram XML text in memory. It does not take screenshots, export images, or attach to a browser canvas.
