etosin/arc-draw

An open-source MCP server that lets your AI agent draw SAP BTP solution diagrams on a live draw.io canvas, with the official SAP icons and the SAP diagram rules built in.

Quick start · Try a prompt · Help build it · Roadmap

_{One prompt to Claude Code, a diagram built live on the draw.io canvas (sped up ~3.5×). The agent finishes by checking its own work with check-sap-diagram.}

Every SAP architect knows the routine. A whiteboard sketch turns into forty minutes of hunting for the right BTP icon, fixing colours and re-routing connectors, just so the diagram looks like something SAP would publish.

Generic AI diagram tools don't fix that. They draw boxes, not SAP products. They use black arrows and random colours, and they put your on-premise S/4HANA inside the BTP boundary.

ARC-DRAW gives your agent the two things it is missing.

On top of that, two tools the agent can call by itself: get-sap-examples (canonical patterns with ground-truth styles) and get-sap-guideline (specific rules by topic: areas, connectors, icons, numbering…).

flowchart LR
    A["You<br/>(plain language)"] --> B["MCP client<br/>Claude Code · Claude Desktop · …"]
    B -- "constitution auto-loaded<br/>+ get-sap-examples / get-sap-guideline" --> C["ARC-DRAW<br/>MCP server"]
    C -- WebSocket --> D["draw.io plugin<br/>+ SAP icon catalog"]
    D --> E["Live canvas<br/>you keep editing by hand"]

Status: early (v0.x). It works and we use it, but expect rough edges. Installation is from source for now; a one-line npx install is on the roadmap.

You need: Node.js 22 LTS, Git, and pnpm (corepack enable, or npm i -g pnpm@10).

git clone https://github.com/etosin/arc-draw.git
cd arc-draw
pnpm install --frozen-lockfile
pnpm -r build

Register the server in your MCP client, using the absolute path to your clone.

{
  "mcpServers": {
    "arc-draw": {
      "type": "stdio",
      "command": "node",
      "args": [
        "/absolute/path/to/arc-draw/packages/drawio-mcp-server/build/index.js",
        "--editor"
      ]
    }
  }
}

Restart your MCP client, open http://localhost:3000/ and leave that tab open. It is the live canvas, and drawing tools only work while it is connected.

• "Draw a TO-BE inbound integration: partner → SOAP sender adapter → Cloud Integration iFlow (enrichment) → REST receiver → S/4HANA on-premise via a standard API. Put Cloud Integration and API Management inside an Integration Suite area and add a legend."
• "Show an AS-IS / TO-BE comparison for replacing a PI/PO interface with Cloud Integration."
• "Side-by-side extension: a CAP app on Cloud Foundry reads S/4HANA through a Destination and Cloud Connector, users sign in through Cloud Identity Services. Number the flow steps."

Then edit the result by hand in the canvas, or ask the agent to change it. Got a prompt that works well, or one that goes wrong? Share it: that is the most useful thing you can do.

ARC-DRAW is built on drawio-mcp-server v2.3, so everything from upstream still works: multi-page and multi-document targeting, layers, edges, Mermaid import, TLS, the browser extension, and the AWS/Azure/GCP/Cisco stencils. You can mix them with SAP shapes in one diagram.

This project needs SAP practitioners more than it needs programmers. The agent is only as good as the rules and patterns we give it, and you know how these diagrams should look.

You don't need to write a line of TypeScript to make a real difference:

Questions and half-formed ideas are welcome in Discussions. Everything is in CONTRIBUTING.md.

Every contributor is credited in the release notes and below. ⭐ A star also helps other SAP people find the project.

• One-line install via npx, with the Claude Code plugin pointing at ARC-DRAW
• Demo GIF and a gallery of community diagrams
• Reusable SAP patterns (AS-IS/TO-BE, BTP inbound/outbound, side-by-side extension)
• Diagram linter: check an existing .drawio file against the SAP guideline
• Decide whether the bundled icon catalog can be retired in favour of draw.io's native SAP palette
• Setup guides for more MCP clients
• Server tests that pass on Windows

Have a better idea? Open a discussion.

We would rather tell you now:

• Installation is from source. The /plugin marketplace entry and the npx drawio-mcp-server install command inherited from upstream install the plain draw.io server, without the SAP layer. Use the manual setup above until the npx install lands.
• Tested with Claude Code. Other MCP clients should work, since this is a standard MCP server, but we have not verified them yet. Tell us what you find.
• Diagram quality depends on the model. The constitution steers the agent; it can't make every model perfect. That is why diagram feedback is so valuable.
• Windows: build and run work from PowerShell, but pnpm test needs Git Bash or WSL, and a few inherited upstream tests assume Linux/macOS.

ARC-DRAW is not the only attempt at teaching an AI agent to draw SAP BTP diagrams. btp-drawio-skill by Wouter Lemaire is a Claude Code plugin: a skill that authors .drawio files directly, with the full official SAP BTP icon library bundled and a structural + style validator script. ARC-DRAW takes a different route: an MCP server that edits a live draw.io canvas, so a person and the agent can work on the same diagram together. The two approaches complement each other, and both follow the official SAP BTP Solution Diagram guideline.

If you know of another one, open an issue and it will be added here.

The agent says there is no document / list-documents is empty. The canvas tab isn't open. Open http://localhost:3000/ and keep it open, then hard-refresh (Ctrl+F5).

MCP client shows Failed to reconnect: -32000. The build didn't run on this machine. Run pnpm install && pnpm -r build and check that packages/drawio-mcp-server/build/index.js exists.

The first launch is slow, or fails with "Could not download the draw.io editor assets". The built-in editor downloads draw.io once and caches it. If GitHub rate-limits your network (common on shared IPs and behind corporate proxies), ARC-DRAW retries through the GitHub release page on its own. If that fails too, it prints the fix. Either:

• set a GITHUB_TOKEN environment variable (any token, no scopes needed) and start again; or
• install the assets by hand: download draw.war from the draw.io releases, unzip it into <folder>/webapp (so that index.html sits directly inside), delete the WEB-INF and META-INF folders in there, and start the server with --asset-path <folder>.

More in TROUBLESHOOTING.md and docs/SAP-INTEGRATION.md.

ARC-DRAW stands on the shoulders of drawio-mcp-server by Ladislav Gazo (MIT). The MCP server, the draw.io plugin, the browser extension and all live-canvas tooling are his work; ARC-DRAW adds the SAP vocabulary and grammar. If you like this, please star the upstream project too. The original README is kept as README.upstream.md.

SAP icons and diagram conventions come from SAP's BTP Solution Diagrams (Apache-2.0). See NOTICE.md. Diagrams are rendered by draw.io.

Created and maintained by Emerson Tosin, SAP Solution Architect.

MIT. See LICENSE.md and NOTICE.md.

ARC-DRAW is an independent community project. It is not affiliated with, sponsored by, or endorsed by SAP SE. SAP, SAP BTP, SAP S/4HANA and other SAP product names are trademarks of SAP SE. SAP icon assets remain subject to their own license terms.