Tooling

Wire MCP server

Model Context Protocol server for Wire. Lets any MCP-compatible agent (Claude Desktop, Claude Code, Cursor, custom CUA) author and edit Wire diagrams as structured graphs — and render them to SVG or PNG. Stdio + streamable-HTTP transports out of the box.

Install

The MCP server ships as @aigentive/wire-mcp. PNG output is opt-in through @resvg/resvg-js.

Terminal

npm install @aigentive/wire-mcp
# optional — for PNG output
npm install @resvg/resvg-js

Run

Pick a transport. stdio is the default for desktop agents (Claude Desktop, Claude Code, Cursor). --http exposes a streamable-HTTP endpoint on port 3860 for cloud agents and remote MCP clients.

Terminal

# stdio — local IDE / desktop clients
node node_modules/@aigentive/wire-mcp/dist/server.js

# streamable HTTP — cloud / network clients
node node_modules/@aigentive/wire-mcp/dist/server.js --http

# When installed globally
wire-mcp           # stdio
wire-mcp --http    # http on port 3860

Environment variables

Variable	Default	Purpose
WIRE_STORAGE_DIR	~/.wire/diagrams	Directory for *.json diagram files
WIRE_HTTP_PORT	3860	HTTP transport port
WIRE_HTTP_HOST	127.0.0.1	HTTP transport host
WIRE_AUDIT_LOG	(stderr only)	JSONL audit log file path
WIRE_DEFAULT_LAYOUT	LR	Default layout direction
WIRE_PREVIEW_BASE	WIRE_CLOUD_URL or http://localhost:3870	Optional override for preview links
WIRE_CLOUD_URL	(unset)	Wire Cloud base URL for authenticated sync
WIRE_CLOUD_API_KEY	(unset)	Wire Cloud API key generated by an authenticated user
WIRE_PNG_ENABLED	false	Enable PNG rasterization (requires @resvg/resvg-js)
WIRE_AGENT_ID	wire-mcp	Audit log actor id

Tools

28 tools cover the full diagram CRUD surface plus rendering, validation, and machine-readable docs. They’re grouped here for orientation; agents discover them through the standard MCP tool list.

Diagram lifecycle

create_diagram	Create a new diagram, optionally seeded from a template (agent-workflow, approval-flow, rag-pipeline).
load_diagram	Load a stored diagram by id.
save_diagram	Overwrite a diagram with full JSON; validates before write.
patch_diagram	Patch top-level diagram fields (`null` clears a field).
list_diagrams	List stored diagrams (recency-sorted).
get_diagram_json	Return raw canonical JSON.

Nodes

add_node	Append a node (any kind), optionally wired via `from` / `branch`.
update_node	Patch fields on a node (`null` to clear).
remove_node	Remove a node and prune incoming refs.
move_node	Persist node position.
resize_node	Persist node size.

Edges

connect	Connect two nodes; supports edge ids, branches, labels, handles, style, label style, routing, and data.
disconnect	Remove a connection (branch-aware sweep when `branch` omitted).
update_edge	Patch an explicit edge by id (handles, style, labelStyle, routing, etc.).
remove_edge	Remove an explicit edge by id.

Structure

add_note	Add an annotation; `attachedTo` for visual association.
add_group	Add a group node and optionally parent existing children.
ungroup	Clear children/parent links for a group.
set_layout	Change layout direction/engine.
patch_metadata	Patch diagram.metadata keys.

Bulk + validation

apply_actions	Apply a batch of WireAction mutations atomically.
validate	Run schema + structural validation; returns issue codes + repair hints.

Render + export

render_svg	Server-side SVG render.
render_png	PNG via @resvg/resvg-js (falls back to SVG when not installed).
render_preview	Return browser and raw asset URLs; cloud share URLs when cloud sync is configured.
summarize_diagram	Plain-text summary (counts by kind, triggers, ends, branches).
export_mermaid	Convert to Mermaid `flowchart` syntax.

Agent guidance

v1_get_agent_guide	Return the concise MCP agent operating guide for live instructions.
v1_get_docs_shape	Return machine-readable docs chunks by topic or natural-language task.

Edge handles and explicit edges

Use from on the target node for ordinary agent-friendly connections. Use an explicit connect call (returning an edge id) when you need stable identity for labels, branches, handles, style, label style, routing, markers, or future edits via update_edge.

json

{
  "diagramId": "agent-router",
  "id": "route-sales",
  "from": "route.sales",
  "to": "notify-sales",
  "label": "sales",
  "fromHandle": "right",
  "toHandle": "left",
  "routing": "smoothstep",
  "style": { "markerEnd": "arrow", "strokeWidth": 2 },
  "labelStyle": { "background": "#ffffff", "fontSize": 12 }
}

Resources

Stored diagrams are exposed as MCP resources, addressable by URI. Agents can read them directly without calling a tool.

URI	Purpose
wire://diagrams/{id}.json	Canonical JSON for a stored diagram.
wire://diagrams/{id}.svg	Server-rendered SVG.
wire://diagrams/{id}.png	PNG rasterization (or SVG fallback).
wire://diagrams/{id}.mermaid	Mermaid `flowchart` syntax.
wire://diagrams/{id}/preview	Browser preview URL.
wire://templates/	List available templates.
wire://templates/{name}	Fetch a single template.
wire://schemas/wire-diagram	JSON schema info.
wire://docs/	Machine-readable docs manifest.
wire://docs/agent-guide.md	Prompt-ready agent guide.
wire://docs/{topic}.shape.json	Topic docs for agent, mcp, react, cloud, schema, validation, examples, or recipes.
wire://docs/examples/{name}.wire.json	Validated example diagrams.
wire://docs/recipes/{id}.json	Task recipes for agents.

Prompts

The server bundles five prompts that frame common diagram-authoring tasks. Clients with prompt support (Claude Desktop, Cursor) surface them as templates.

Name	Purpose
diagram_from_codebase	Generate an architecture diagram from a repo.
diagram_from_logs	Reconstruct a workflow from log lines.
diagram_from_workflow_description	Convert prose into a diagram.
review_diagram_for_clarity	Critique an existing diagram.
simplify_diagram	Refactor for clarity.

Claude Desktop config

Drop this into ~/Library/Application Support/Claude/claude_desktop_config.json (or the equivalent on Windows / Linux), restart Claude Desktop, and the Wire tools appear in the tool picker.

json

{
  "mcpServers": {
    "wire": {
      "command": "node",
      "args": ["/absolute/path/to/wire/packages/wire-mcp/dist/server.js"],
      "env": {
        "WIRE_STORAGE_DIR": "/Users/me/Documents/wire-diagrams"
      }
    }
  }
}

NextWire CLI