MCP Mermaid

Name: MCP Mermaid
Availability: InStock
Author: hustcc

Supports UI

by hustcc

Generate interactive Mermaid diagrams and charts dynamically using AI within your MCP-enabled client.

0 stars

2 views

Works in:VS Code CopilotCursor

Exposes:Tools

View on GitHub Docs

What it does

Connects an AI model to the Mermaid.js engine, allowing it to generate complex diagrams, flowcharts, and charts on the fly. It transforms text descriptions into visual representations that can be rendered as SVG or PNG.

Tools

render_mermaid: Generates a diagram from Mermaid syntax, supporting various output formats like base64, SVG, and remote URLs.

Installation

Add the following to your claude_desktop_config.json:

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

Supported hosts

Confirmed for Claude Desktop, VS Code, Cline, and Cherry Studio.

Quick install

npx -y mcp-mermaid

Information

Pricing: free
Published: 4/22/2026
stars

Related Apps

Choose your AI client and follow the steps below.

Claude Desktop

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