This is not generating a file to open afterwards — shapes appear in the open canvas, and the agent can read the model back to see the result. Stencils being discovered from the sidebar is what lets it place a real GCP or Cisco icon instead of a labelled box.
A bridge into Draw.io that lets an agent create, read, modify and delete diagram elements. It either hosts the editor itself, reachable in your browser, or connects to Draw.io already running there through a browser extension. Vendor stencils are discovered from the sidebar at runtime, so cloud icons can be placed by their real names.
- Rectangles, shapes and edges added to a page, edited, restyled, given data, and deleted by id
- The shape catalog browsable — categories, the shapes inside one, and a shape looked up by name — with AWS, GCP, Azure, Cisco19 and CiscoSafe stencils discovered from Draw.io's own sidebar rather than a hand-written list
- The model read back page by page, and the currently selected cell inspected, so an agent can see what it just drew
- Layers created, switched, and cells moved between them, plus parent-child nesting for grouping
- Pages listed, created, copied and renamed, with the current page readable and page-scoped tools taking an explicit target
- Several open documents addressed individually, with operations serialised per document so two agents on two files do not collide
- Diagrams imported and exported as XML, or as SVG and PNG with the XML embedded, and Mermaid diagrams imported straight in
Node.js v22 or higher, run over stdio from npm as drawio-mcp-server. With the editor flag it hosts Draw.io itself and you open http://localhost:3000/ — nothing else to install. The alternative is the browser extension, which needs Draw.io already open in your browser; Firefox works but requires TLS mode, and the server can generate self-signed certificates for that itself. Integration with the desktop Electron app is not there yet, blocked upstream.
One command — npx -y drawio-mcp-server --editor