An MCP server that draws BTP solution diagrams onto a live draw.io canvas, with 111 SAP BTP icons as native shapes and SAP's diagram guidelines handed to the client as drawing rules.
The agent gets two things: 111 SAP BTP icons as native sap.* shapes, so it places sap.cloud_integration instead of a labelled box, and the SAP BTP Solution Diagram GuidelinesSAP BTP Solution Diagram GuidelinesSAP's visual language for BTP solution diagrams, in line with the SAP Fiori Horizon principles and colour palette, with editable templates for draw.io and PowerPoint.sap official, btp distilled into a drawing constitution that reaches the MCP client the moment it connects, covering colours, connector semantics, area nesting and compose order. Two further tools let the agent ask for a canonical pattern or for a rule by topic. It draws onto a live canvas rather than writing a file: draw.iodraw.ioA diagram editor, on the web and as a desktop app. The BTP diagram skills here write .drawio files, and a person opens and edits them in it. has to be open at http://localhost:3000/, and the drawing tools work only while that tab is connected. The draw.io half is drawio-mcp-server by Ladislav Gazo, which the maintainer credits as what ARC-DRAW stands on. Installation is from source with pnpm, and a one-line npx install sits on the maintainer's list of what is still to come.
Any run nobody is watching: the drawing tools work only while the draw.io canvas at http://localhost:3000/ is open and connected, so there is no diagram to produce on a build agent or a server. Nothing checks the result either, because the maintainer keeps a diagram linter on the roadmap rather than in the release. The maintainer marks the status early at v0.x, installs it from source, and records testing with Claude Code alone.
The maintainer lists a diagram linter that would check an existing .drawio file against the SAP guideline on the roadmap, so the release carries no such check. The guideline reaches the agent as a drawing constitution before the diagram, not as a check after it.
Read the drawn canvas by eye, or run one of the other contributions over the exported file.
The guideline reaches the MCP client as a drawing constitution the moment it connects, rather than being loaded as a skill the agent decides to read. Two tools, get-sap-examples and get-sap-guideline, let the agent ask for a canonical pattern or a rule by topic afterwards.
Install from source and keep a draw.io canvas open and connected, since that is what the drawing tools work against. Nothing here checks the result: the maintainer keeps a diagram linter on the roadmap.
Packaged knowledge that teaches a coding agent a framework
Drawing a solution's architecture and components
A diagram editor, on the web and as a desktop app. The BTP diagram skills here write .drawio files, and a person opens and edits them in it.
A cross-platform JavaScript runtime that servers, command line tools and scripts written in JavaScript are run with. For the things here, the prerequisite a repository names when its build is a set of npm scripts.
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.
| What it is | Why it matters | |
|---|---|---|
| 🎨 Vocabulary | 111 SAP BTP icons as native sap.* shapes, plus draw.io's own SAP palette (mxgraph.sap.*) when your draw.io ships it | The agent places sap.cloud_integration, not "a blue box labelled CPI". Icons live in the plugin, so they never eat your model's context. |
| 📐 Grammar | The SAP BTP Solution Diagram guideline distilled into a drawing constitution, sent to your MCP client the moment it connects | Colours, connector semantics (solid = sync, dashed = async), area nesting and compose order become rules the agent follows, not suggestions. |
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…).
Status: early (v0.x). It works and we use it, but expect rough edges. Installation is from source for now; a one-line
npxinstall 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 buildRegister 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"
]
}
}
}On Windows use forward slashes: C:/Users/you/dev/arc-draw/packages/drawio-mcp-server/build/index.js.
Corporate security agents like port 3000. Add "--http-port", "4000" to args and open http://localhost:4000/ instead.
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.
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.
| Category | Icons |
|---|---|
sap.foundation | 43 |
sap.integration_suite | 15 |
sap.app_dev_and_automation | 17 |
sap.data_and_analytics | 8 |
sap.btp_saas | 17 |
sap.ai | 11 |
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:
| I have… | I can… | Time |
|---|---|---|
| 5 minutes | Report a diagram the agent got wrong. Include your prompt and a screenshot. | ⏱️ |
| A diagram I draw every month | Propose a pattern: AS-IS/TO-BE, event-driven, side-by-side extension… | ⏱️⏱️ |
| The SAP guideline open | Spot a rule in constitution/ that doesn't match it, and fix it in a PR. | ⏱️⏱️ |
| A different MCP client | Tell us if it works with Cursor, Copilot, Codex, Zed…, or write the setup guide. | ⏱️⏱️ |
| A screen recorder | Record the demo GIF that should sit at the top of this README. | ⏱️⏱️ |
| TypeScript skills | Pick a good first issue or a help wanted. | ⏱️⏱️⏱️ |
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.
npx, with the Claude Code plugin pointing at ARC-DRAW.drawio file against the SAP guidelineHave a better idea? Open a discussion.
We would rather tell you now:
/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.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:
GITHUB_TOKEN environment variable (any token, no scopes needed) and start again; ordraw.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.
Sources are graph entities: the same page may back several entries, and an unreachable source flags every row that rests on it.
artifact:etosin-arc-draw