MCP SERVER · OFFICIAL PROJECTTurn a description, a JSON blob, an ASCII sketch, a whiteboard photo or a Mermaid file into a diagram you can open and edit in the browser.
LABSCO SUMMARY
That uniformity is the useful part — the input format stops being a decision about which API to learn and becomes an argument. There is no editing, layout or re-render tool here, so a diagram that comes back wrong is revised in the browser page the call returns rather than through a second call. generate_diagram_from_mermaid is the odd member: it changes notation rather than medium, taking Mermaid source to D2 and returning a PNG.
A diagram generator split by input format — natural-language description, JSON structure, ASCII art, image or Mermaid source — returning a link to view and edit the generated diagram in the browser.
An AI Diagram Maker API key, supplied as ADM_API_KEY. Images have to arrive as a public URL or an inline base64 data URI, so a local screenshot needs to be encoded or hosted first.
One command plus a key — ADM_API_KEY=<YOUR_ADM_API_KEY> npx ai-diagram-maker-mcp@latest
USE CASES
Hand over the description you already wrote and name the form you want it in, rather than opening a drawing tool to say the same thing again.
Pass the raw response as content and read the shape as a picture instead of counting brackets.
Take the version already sitting in a README or a code comment and turn it into something presentable without redrawing it.
Send the photo of the session as a URL or a base64 data URI and get back something that can go in the write-up.
Counted once with only startup setup. Other versions, modes or optional credentials may expose a different list.
generate_diagram_from_asciiConvert an ASCII art diagram into a polished visual diagram. Use this tool when the user has an existing ASCII art representation of a system, flow, or architecture and wants it rendered as a proper diagram. Accepts box-drawing characters, arrow representations (-->, ==>), and plain text layouts. Returns a link to view and edit the generated diagram in the browser.
generate_diagram_from_imageConvert an image (whiteboard photo, screenshot, hand-drawn sketch) into a clean diagram. Use this tool when the user provides an image URL or base64-encoded image and wants it converted to a proper software engineering diagram. Accepts public image URLs or base64 data URIs (data:image/...;base64,...). Returns a link to view and edit the generated diagram in the browser.
generate_diagram_from_jsonGenerate a diagram from a JSON structure. Use this tool when the user wants to visualise JSON data such as API responses, database schemas, dependency trees, configuration files, or any structured data. Pass the raw JSON string as content. Returns a link to view and edit the generated diagram in the browser.
generate_diagram_from_mermaidConvert a Mermaid diagram definition into a D2 diagram and return a PNG image. Use this tool when the user has existing Mermaid code (flowchart, sequenceDiagram, erDiagram, etc.) and wants it converted to D2 or rendered as an image. Pass the Mermaid source as content. Returns a link to view and edit the generated diagram in the browser.
generate_diagram_from_textGenerate a software engineering diagram from a natural language description. Use this tool when: the user asks to 'create a diagram', 'show me a flowchart', 'visualise the architecture', uses the keyword 'adm' or 'ai diagram maker', or asks for any visual representation of code, systems, processes or data flows. Supported diagram types: flowchart, sequence, ERD, system architecture, network architecture, UML, mindmap, workflow. Returns a link to view and edit the generated diagram in the browser.
BEFORE YOU INSTALL
5 tools when we connected. The stdio route reads ADM_API_KEY from the environment; run as an HTTP server (--transport http), it takes the key in an X-ADM-API-Key header instead.
ADM_API_KEY in your environment
CONTEXT COST
Rated by the size of the 5 tool definitions that ride along on every turn, not by how many there are
INSTALLATION
ADM_API_KEY=<YOUR_ADM_API_KEY> npx ai-diagram-maker-mcp@latest{
"mcpServers": {
"ai-diagram-maker": {
"command": "npx",
"args": [
"-y",
"ai-diagram-maker-mcp@latest"
],
"env": {
"ADM_API_KEY": "<YOUR_ADM_API_KEY>"
}
}
}
}claude mcp add ai-diagram-maker -t stdio -e ADM_API_KEY=<YOUR_ADM_API_KEY> -- npx -y ai-diagram-maker-mcp@latestStart the server over HTTP. It listens on $PORT, or 3001 by default:
npx ai-diagram-maker-mcp@latest --transport httpPoint your client at /mcp on that server — http://localhost:3001/mcp by default — and send your API key on every request in an X-ADM-API-Key header (or Authorization: Bearer).
MCP servers
alwank
mab-go
acearv09876
OliverGrabner