Skip to main content
Glama
deenesjakoruzh
hustcc

MCP Server Mermaid

by hustcc
OverviewSchemaRelated ServersScoreDiscussions
TypeScript
Hybrid

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" を使用すると、AIエージェント用にPNGダイアグラムをディスクへ自動保存したり、URLモードを使用して公開されている mermaid.ink リンク経由でダイアグラムを共有したりできます。

Related MCP server: Mermaid-MCP

🤖 使用方法

Claude、VSCode、Cline、Cherry Studio などの Desktop APP で使用するには、以下のMCPサーバー設定を追加してください。Macシステムの場合：

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

Windowsシステムの場合：

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

また、HTTPやSSEプロトコルを使用して、aliyun、modelscope、glama.ai、smithery.ai などでも利用可能です。

アクセスポイント:

  • 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オプションも使用できます。コマンドオプションは -h を付けてCLIを実行してください。

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

直接ノードコマンドを使用する場合:

# 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.

Install Server
A
license - permissive license
B
quality
C
maintenance

How are these scores calculated?

Maintenance

–Maintainers
31dResponse time
4wRelease cycle
6Releases (12mo)
Commit activity
Issues opened vs closed

Resources

Tools

Related MCP Servers

  • mcp-mermiad

    Narasimhaponnada
    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.
    51

  • AI Charts

    tjameswilliams
    A
    license
    Not graded
    quality
    D
    maintenance
    An MCP server that enables AI assistants to programmatically create and manage flowcharts, ERDs, and swimlane diagrams. It provides tools for manipulating diagram structures, performing auto-layouts, and exporting to Mermaid or Markdown formats.
    14
    MIT

View all related MCP servers

Related MCP Connectors

  • CodePic

    AI agent draws editable hand-drawn diagrams (flowchart, ER, architecture) via MCP, not static images

  • DiagramZu

    Let Claude, Cursor, or ChatGPT author Mermaid diagrams your team can read and share.

  • Diagrams MCP

    Generate cloud architecture diagrams, flowcharts, and sequence diagrams.

View all MCP Connectors

Appeared in Searches

Latest Blog Posts

MCP directory API

We provide all the information about MCP servers via our MCP API.

curl -X GET 'https://glama.ai/api/mcp/v1/servers/hustcc/mcp-mermaid'

If you have feedback or need assistance with the MCP directory API, please join our Discord server