mermaid-mcp

An MCP server that renders Mermaid diagrams to PNG, SVG, or PDF — or converts them to editable draw.io files. Give your LLM the ability to turn diagram syntax into actual images and documents.

Quick start

Claude Code

claude mcp add mermaid -- npx -y mermaid-render-mcp

Claude Desktop

Add to claude_desktop_config.json:

{
  "mcpServers": {
    "mermaid": {
      "command": "npx",
      "args": ["-y", "mermaid-render-mcp"]
    }
  }
}

Note: the first run downloads headless Chromium (~150 MB), so the initial startup takes a few minutes. If you only need flowcharts and can work with editable files, the drawio fast path skips Chromium entirely.

Docker

No Node.js or Chromium download needed — the image ships with everything (including CJK fonts for Japanese/Chinese/Korean labels):

claude mcp add mermaid -- docker run -i --rm tcinebula/mermaid-render-mcp

To use output_path, mount a host directory and write into it:

{
  "mcpServers": {
    "mermaid": {
      "command": "docker",
      "args": ["run", "-i", "--rm", "-v", "C:\\diagrams:/out", "tcinebula/mermaid-render-mcp"]
    }
  }
}

Then pass output_path: "/out/figure.pdf" and the file appears in C:\diagrams.

Remote / self-hosted (HTTP)

The same server speaks Streamable HTTP when PORT is set (or MCP_TRANSPORT=http), so it can be deployed to any container host — Railway, Fly.io, etc. — straight from the Dockerfile:

• Endpoint: POST /mcp (health check at /healthz)
• Set AUTH_TOKEN to require Authorization: Bearer <token>
• output_path is disabled in HTTP mode; base64/XML responses only

From source

git clone https://github.com/tci-nebula/mermaid-mcp.git
cd mermaid-mcp
npm install
claude mcp add mermaid -- node /path/to/mermaid-mcp/server.js

Tool: render_diagram

Returns the rendered image as base64-encoded data so MCP clients can display it inline — or, with output_path, writes the file to disk (handy for PDFs destined for printing or formal document submission).

Example

Ask your LLM:

"Draw me a flowchart of the OAuth login flow"

It generates the Mermaid syntax, calls render_diagram, and you get back a PNG.

The drawio fast path (no Chromium)

format: "drawio" is the one output that never touches a browser. It's pure JavaScript — parse, lay out with dagre, emit XML — so there's no Chromium download, no ~150 MB install, and no multi-minute first run. Conversion is effectively instant.

Reach for it when:

• you want the diagram editable rather than flat — every shape stays a real draw.io object
• you're on a constrained box (CI, a slim container, a locked-down laptop) where downloading Chromium isn't practical
• you just want the diagram now and don't need a raster image

{
  "syntax": "flowchart TD\n  A[Start] --> B{OK?}\n 

... [View full README on GitHub](https://github.com/tci-nebula/mermaid-mcp#readme)