Four ways to make an LLM draw architecture diagrams

What it does

This is the official bridge between draw.io and LLMs via the Model Context Protocol. It exposes four distinct integration patterns: a hosted MCP App server that renders interactive diagrams inside chat, a local tool server (@drawio/mcp) that opens the editor in a browser, a Claude Code skill that writes native .drawio files, and zero-install project instructions that generate shareable URLs. The goal is to let AI assistants produce diagrams you can actually edit, search, and version control instead of staring at text descriptions.

The interesting bit

The project treats a single XML reference file as the single source of truth for LLM prompt engineering; all four integration methods consume it, so updating diagram generation guidance happens in one place. The shape search index is also automatically rebuilt from the live draw.io web client on every release via jsdom, meaning the 10,000+ shape catalog never goes stale.

Key highlights

• Inline diagram rendering inside chat via the MCP Apps extension, with a graceful fallback to raw XML text in unsupported hosts
• search_shapes tool covering 10,000+ shapes across AWS, Azure, Kubernetes, Cisco, UML, and other libraries, returning exact style strings for XML
• Four integration tiers: hosted endpoint (no install), local tool server (@drawio/mcp), Claude Code skill with optional PNG/SVG/PDF export, or copy-paste project instructions
• A shared XML reference file keeps LLM prompt guidance synchronized across all four approaches
• Shape index auto-refreshes via GitHub Action on every draw.io release

Caveats

• MCP App Server inline previews require an MCP Apps-compatible host; otherwise the tool returns plain XML text
• PNG, SVG, and PDF export in the Skill + CLI path requires draw.io Desktop; URL generation does not
• The MCP App Server and Skill + CLI only support native XML, while the Tool Server and Project Instructions also handle CSV and Mermaid

Verdict

Worth exploring if you want LLMs to produce persistent, editable diagrams rather than one-off explanations. If your AI workflows are strictly text-based, this adds nothing you need.