Get the FREE Ultimate OpenClaw Setup Guide →

mermaid

An MCP server providing tools for validating and rendering Mermaid diagrams.

Installation
Run this command in your terminal to add the MCP server to Claude Code.
Run in terminal:
Command
claude mcp add --transport stdio abekdwight-mermaid-mcp-server node /absolute/path/to/mermaid-mcp-server/build/index.js \
  --env MCP_LOG_LEVEL="info" \
  --env PUPPETEER_SKIP_DOWNLOAD="If set to true, skip Puppeteer download (not recommended for first run)."

How to use

The Mermaid MCP Server exposes tools to validate, render, and access documentation for Mermaid diagrams within an MCP client workflow. It integrates with clients like Roo Cline to let AI assistants verify syntax, render diagrams to SVG, and fetch the official Mermaid docs link. Once configured in your MCP client, you can invoke the available tools to work with Mermaid code snippets in a constrained, repeatable way: validate_mermaid checks syntax without rendering, render_mermaid_svg produces an SVG image from valid Mermaid code, and get_mermaid_docs_link returns the official Mermaid documentation URL. This enables automated diagram workflows, diagram validation before rendering in UI, and quick access to guidance when composing Mermaid syntax.

How to install

Prerequisites:

  • Node.js v18 or later
  • npm (or yarn) installed
  • An MCP client setup (e.g., Roo Cline) and a place to configure MCP servers

Installation steps:

  1. Install the server (globally for easy access) or install locally in your project: npm install -g mermaid-mcp-server

    or install locally and reference via a local path

  2. Build from source (if you cloned the repo): git clone https://github.com/TanisukeGoro/mermaid-mcp-server.git cd mermaid-mcp-server npm install npm run build

  3. Configure your MCP client (Roo Cline) to include the server. In your MCP settings JSON, add: { "mcpServers": { // ... other servers "mermaid-mcp-server": { "command": "mermaid-mcp-server", // or provide absolute path if built from source // If using the built source, use the absolute path to the built index.js via node: // "command": "node", // "args": ["/absolute/path/to/mermaid-mcp-server/build/index.js"], "disabled": false, "alwaysAllow": [] } } }

  4. Restart the MCP client (Roo Cline) to pick up the new server configuration.

Additional notes

Notes and tips:

  • The server uses @mermaid-js/mermaid-cli under the hood and Puppeteer to render diagrams. Puppeteer will download a compatible Chromium if not present. Ensure you have network access during the first run or when dependencies update.
  • If you run behind a firewall or restricted environment, consider setting Puppeteer to use an existing Chromium or configuring environment to allow downloads.
  • For faster development, you can run npm run watch to rebuild on changes and npm run inspector to test with the MCP Inspector.
  • The npm package name to reference in your MCP client is mermaid-mcp-server (as shown in the installation and README). If you install locally, you’ll reference the local path instead of a package name.
  • If you deploy, ensure the path in the MCP client points to the actual built entry file (build/index.js) and that the environment has Node.js and required dependencies installed.

Related MCP Servers

Sponsor this space

Reach thousands of developers