Skip to main content
Glama

MCP Mermaid build npm Version npm License Trust Score

使用 AI MCP 动态生成 mermaid 图表。你也可以使用:

  • mcp-server-chart 来生成图表、图形和地图。

  • Infographic 来生成信息图,例如 Timeline(时间轴)、Comparison(对比)、List(列表)、Process(流程)等。

  • 🖼️ figure.ling.pub/gallery 用于浏览和分享使用 mcp-mermaid 及其他工具生成的 AI 图表和图形。

✨ 功能特性

  • 全面支持 Mermaid 的所有功能和语法。

  • 支持 backgroundColor 和 theme 配置,使大型 AI 模型能够输出丰富的样式配置。

  • 支持导出为 base64、svg、mermaid、file 以及对远程友好的 svg_url 和 png_url 格式,并对 Mermaid 进行验证,以方便模型进行多轮输出正确的语法和图形。使用 outputType: "file" 可以自动将 PNG 图表保存到磁盘供 AI 代理使用,或者使用 URL 模式通过公共的 mermaid.ink 链接分享图表。

Related MCP server: Mermaid-MCP

🤖 使用方法

若要在 Claude、VSCode、Cline、Cherry Studio 等 桌面应用 中使用,请添加以下 MCP 服务器配置。在 Mac 系统上:

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

在 Windows 系统上:

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

此外,你也可以在 aliyun、modelscope、glama.ai、smithery.ai 或其他支持 HTTP 和 SSE 协议的平台上使用它。

访问点:

  • SSE: http://localhost:3033/sse

  • Streamable: http://localhost:1122/mcp

可用的 Docker 标签:

  • susuperli/mcp-mermaid:latest - 最新稳定版本

  • 在 Docker Hub 查看所有可用标签

🚰 使用 SSE 或 Streamable 传输运行

选项 1:全局安装

全局安装该包:

npm install -g mcp-mermaid

使用你偏好的传输选项运行服务器:

# For SSE transport (default endpoint: /sse)
mcp-mermaid -t sse

# For Streamable transport with custom endpoint
mcp-mermaid -t streamable

选项 2:本地开发

如果你在本地处理源代码:

# Clone and setup
git clone https://github.com/hustcc/mcp-mermaid.git
cd mcp-mermaid
npm install
npm run build

# Run with npm scripts
npm run start:sse        # SSE transport on port 3033
npm run start:streamable # Streamable transport on port 1122

访问点

然后你可以通过以下地址访问服务器:

  • SSE 传输: http://localhost:3033/sse

  • Streamable 传输: http://localhost:1122/mcp (本地) 或 http://localhost:3033/mcp (全局)

🎮 CLI 选项

运行 MCP 服务器时,你也可以使用以下 CLI 选项。通过运行 cli -h 查看命令选项。

MCP Mermaid CLI

Options:
  --transport, -t  Specify the transport protocol: "stdio", "sse", or "streamable" (default: "stdio")
  --port, -p       Specify the port for SSE or streamable transport (default: 3033)
  --endpoint, -e   Specify the endpoint for the transport:
                    - For SSE: default is "/sse"
                    - For streamable: default is "/mcp"
  --help, -h       Show this help message

🔨 开发

安装依赖:

npm install

构建服务器:

npm run build

启动 MCP 服务器

使用 MCP Inspector(用于调试):

npm run start

使用不同的传输协议:

# SSE transport (Server-Sent Events)
npm run start:sse

# Streamable HTTP transport
npm run start:streamable

直接使用 node 命令:

# SSE transport on port 3033
node build/index.js --transport sse --port 3033

# Streamable HTTP transport on port 1122
node build/index.js --transport streamable --port 1122

# STDIO transport (for MCP client integration)
node build/index.js --transport stdio

🐳 Docker 使用

使用 Docker 运行 MCP Mermaid:

# Pull the image
docker pull susuperli/mcp-mermaid:latest

# Run with SSE transport (default)
docker run -p 3033:3033 susuperli/mcp-mermaid:latest --transport sse

# Run with streamable transport
docker run -p 1122:1122 susuperli/mcp-mermaid:latest --transport streamable --port 1122

📄 许可证

MIT@hustcc。

Available Tools

1 tool
generate_mermaid_diagramBInspect

Generate mermaid diagram and chart with mermaid syntax dynamically. Mermaid is a JavaScript based diagramming and charting tool that uses Markdown-inspired text definitions and a renderer to create and modify complex diagrams. The main purpose of Mermaid is to help documentation catch up with development.

ParametersJSON Schema
NameRequiredDescriptionDefault
mermaidYesThe mermaid diagram syntax used to be generated, such as, graph TD; A-->B; A-->C; B-->D; C-->D;.
themeNoTheme for the diagram (optional). Default is 'default'.default
backgroundColorNoBackground color for the diagram (optional). Default is 'white'.white
outputTypeNoThe output type of the diagram. Can be 'base64', 'svg', 'mermaid', 'file', 'svg_url', or 'png_url'. Default is 'base64'. 'base64' returns PNG image as base64 encoded string. 'file' saves the PNG image to disk. The *_url options return public mermaid.ink links for remote-friendly sharing.base64

TDQS

B3.2/5.0
Behavior2/5

Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?

With no annotations, the description fails to disclose behavioral traits such as side effects, performance, or limitations. It only broadly states dynamic generation without specifics.

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness4/5

Is the description appropriately sized, front-loaded, and free of redundancy?

The description is concise with two sentences, but the second sentence focuses on Mermaid's general purpose rather than the tool's specific behavior. No filler words.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness3/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

The description does not explain the output format or how to use the returned data. With no output schema, relying on the outputType parameter is insufficient for complete understanding.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters3/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

The input schema has 100% description coverage, so the parameters are already well-documented. The description adds no additional meaning beyond what the schema provides.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose5/5

Does the description clearly state what the tool does and how it differs from similar tools?

The description clearly states the tool's purpose: generating mermaid diagrams and charts dynamically. It explains what Mermaid is, providing context for the tool's functionality.

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines2/5

Does the description explain when to use this tool, when not to, or what alternatives exist?

No guidance is provided on when to use this tool or when not to use it. There are no alternatives mentioned, and the description lacks explicit usage context.

Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.

Tool Schema Changelog

Recent tool additions, removals, and schema changes observed during successful MCP inspections.

  1. 1 tool updatev1.0.0
    • Changedgenerate_mermaid_diagram3 fields changed
      • changedInput schema / properties / outputType / default
        Previous value: -"png"New value: +"base64"
      • changedInput schema / properties / outputType / description
        Previous value: -"The output type of the diagram. Can be 'png', 'svg' or 'mermaid'. Default is 'png'."New value: +"The output type of the diagram. Can be 'base64', 'svg', 'mermaid', 'file', 'svg_url', or 'png_url'. Default is 'base64'. 'base64' returns PNG image as base64 encoded string. 'file' saves the PNG image to disk. The *_url options return public mermaid.ink links for remote-friendly sharing."
      • changedInput schema / properties / outputType / enum
        Previous value: -[
        -  "png",
        -  "svg",
        -  "mermaid"
        -]New value: +[
        +  "base64",
        +  "svg",
        +  "mermaid",
        +  "file",
        +  "svg_url",
        +  "png_url"
        +]
  2. 1 tool update
    • First observedgenerate_mermaid_diagram

TDQS

B3.4/5.0

Scored across 1 tool

Disambiguation5/5

With only one tool, there is no possibility of confusion between tools. The tool's purpose is clear and stands alone.

Naming Consistency5/5

Since there is only one tool, naming consistency is not applicable, but the single name follows a clear descriptive pattern.

Tool Count3/5

A single tool for generating Mermaid diagrams is minimal. While it covers the core functionality, the scope feels thin (1 tool) compared to typical MCP servers that handle diagramming workflows.

Completeness3/5

The tool covers the primary task of generating diagrams, but lacks auxiliary operations such as validation, styling, or export options that would enhance completeness for a diagramming server.

Maintenance

ActivityInactive
ResponsivenessUnresponsive

Related MCP Connectors

Related MCP Servers

  • F
    license
    Not graded
    quality
    F
    maintenance
    Narasimhaponnada/mermaid-mcp - AI-powered Mermaid diagram generation with 22+ diagram types including flowcharts, sequence diagrams, class diagrams, ER diagrams, architecture diagrams, state machines, and more. Features 50+ pre-built templates, advanced layout engines, SVG/PNG/PDF exports.
    53
    -
  • A
    license
    Not graded
    quality
    D
    maintenance
    Enables automatic generation of UML class diagrams and entity-relationship diagrams from natural language descriptions or structured JSON data. It integrates with MCP agents to create visual representations of code structures and system designs without manual Mermaid coding.
    8 npm
    1
    MIT