How to set up the ArchDraw MCP server in Claude Desktop
A step-by-step guide to connecting the ArchDraw MCP server to Claude Desktop so Claude can generate, edit, validate, and export architecture diagrams directly from the chat window.
01What you need before you start
The easiest method is a custom connector. Claude Desktop then connects to the hosted ArchDraw server at `https://archdraw.hiabhee.online/api/mcp`. You do not install software, and you do not clone the repository. If you cannot use a custom connector, use the local server. The local server needs Node.js 18 or later.
- •Claude Desktop, installed and signed in
- •Network access to `archdraw.hiabhee.online`
- •For the local server only: Node.js 18 or later. Type `node --version` to examine the version.
02Add ArchDraw as a custom connector (recommended)
Go to Settings → Connectors and select Add custom connector. Type `ArchDraw` as the name and the URL below. Then select Add. The connector is also available on claude.ai and in Claude mobile with the same account. On Team and Enterprise plans, it is possible that an owner must add the connector first.
https://archdraw.hiabhee.online/api/mcp03Use the local server (alternative)
Use this method only if you cannot use a custom connector. Open the Claude Desktop configuration file. The path depends on your operating system:
- •macOS: `~/Library/Application Support/Claude/claude_desktop_config.json`
- •Windows: `%APPDATA%\Claude\claude_desktop_config.json`
04Register the local server in the config file
Add an `archdraw` entry to the `mcpServers` block. `npx` downloads the pinned version of the server from npm and runs it. You must set `API_BASE_URL`. If you do not set it, the tools show, but diagram generation and layout do not operate.
- •`command` — if Claude cannot find `npx`, use the full path from `which npx`
- •`args` — the pinned package version; change the number to update
- •`env.API_BASE_URL` — the ArchDraw API; use your own domain for a self-hosted deployment
{
"mcpServers": {
"archdraw": {
"command": "npx",
"args": ["-y", "@hiabhee/archdraw-mcp-server@1.0.6"],
"env": {
"API_BASE_URL": "https://archdraw.hiabhee.online"
}
}
}
}05Restart Claude Desktop and verify the connection
MCP servers are discovered at startup, so fully quit Claude Desktop (Cmd+Q on macOS) and reopen it. Open a chat and click the tools icon to see the connected server, or simply ask Claude what it can do. The `read_me` tool returns the full server reference — asking for it first is a good habit.
"Draw a three-tier architecture: a React frontend, a Node API behind an API gateway, and a PostgreSQL database"06What Claude can do once connected
Once the server is registered, Claude can drive the entire diagram workflow from the chat window. The server exposes these tools over stdio:
- •`read_me` — the full server reference; call it first to learn the rules and domain checklist
- •`generate_diagram` — turn a prompt or Mermaid snippet into a laid-out diagram
- •`update_diagram` — add nodes, rewire edges, and change tiers on the current canvas
- •`validate_diagram` and `fix_layout` — run structural checks and repair the layout
- •`apply_template` and `list_templates` — load curated architecture templates
- •`save_checkpoint` and `load_checkpoint` — snapshot and restore diagram state
- •`export_diagram` — export as JSON, PNG, or SVG
- •`list_node_types` — look up available components and icons
- •`get_diagram_state` — inspect the current canvas nodes and edges
07Troubleshooting
Most connection issues come from paths, PATH resolution, or forgetting to restart Claude. Walk through these in order:
- •The local server does not start — make sure that Node.js 18 or later is installed. Type `node --version` to examine the version.
- •`npx` is not found — replace `"npx"` in the config with the full path from `which npx`.
- •The tools show, but generation fails with "requires API_BASE_URL" — add `API_BASE_URL` to the `env` block.
- •Tools do not appear after editing the config — quit Claude Desktop completely (Cmd+Q), not just the window, and reopen it.
- •Config file is invalid — check Claude's log file (`claude_mcp_logs.txt`, stored next to the config) for JSON parse errors.