# hustcc/mcp-mermaid [Health: Active]

**Category:** 👤 Customer Data Platforms  
**Repository:** https://github.com/hustcc/mcp-mermaid  
**GitHub Stars:** 631  
**Views:** 3  
**Installs:** 0  
**Upvotes:** 1  
**Directory Page:** https://allmcps.com/mcp/hustcc-mcp-mermaid

## Description
Generate mermaid diagram and chart with AI MCP dynamically.

## Tools
Capabilities this server exposes over MCP:

- **generate_mermaid_diagram** — 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.

## Claude Desktop Quick Installation
Install path detected from listing signals. Uses `npx` (confidence: high):

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

## Documentation

## What hustcc/mcp-mermaid MCP server does

The hustcc/mcp-mermaid MCP server exposes Mermaid diagram generation through the `generate_mermaid_diagram` MCP tool. An AI client can provide Mermaid text definitions and receive a rendered diagram or chart. Mermaid uses Markdown-inspired text syntax, so the server is suited to workflows where an agent generates or revises diagram definitions as part of documentation, planning, or explanation tasks.

The implementation is intended to cover Mermaid syntax and features. It also accepts visual configuration for `backgroundColor` and `theme`, allowing generated diagrams to include styling choices alongside their structural definition.

## How it works

The client invokes `generate_mermaid_diagram` with Mermaid content and output options. The server validates Mermaid syntax and can return several representations: `base64`, `svg`, `mermaid`, `file`, `svg_url`, or `png_url`. File output saves a PNG diagram to disk for an AI agent, while URL outputs provide links suitable for sharing through Mermaid’s public rendering service.

The hustcc/mcp-mermaid MCP server can operate with stdio for desktop MCP clients or with HTTP-based transports for clients and services that connect over a network. SSE uses `/sse` by default on port 3033. Streamable HTTP uses `/mcp`; the documented default is port 1122 for local development, while the global CLI example uses port 3033.

## Setup and configuration

For a desktop client, install and run the npm package through `npx`:

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

The documented configuration is shown for Claude and can also be used with clients such as Cline. The package supports a CLI with three transport values: `stdio`, `sse`, and `streamable`. Use `--port` to change the HTTP port and `--endpoint` to change the transport path.

For a locally installed package, run `mcp-mermaid -t sse` or `mcp-mermaid -t streamable`. Source-based development uses `npm install`, `npm run build`, and the supplied start scripts. Docker images are also documented under `susuperli/mcp-mermaid`, including commands for exposing SSE on port 3033 or streamable HTTP on port 1122.

## Tools and capabilities

- `generate_mermaid_diagram`: Generates Mermaid diagrams and charts from Mermaid syntax.
- Supports Mermaid diagram and chart syntax.
- Applies `backgroundColor` and `theme` configuration.
- Validates Mermaid output during generation.
- Returns base64, SVG, Mermaid text, file, SVG URL, or PNG URL output.
- Supports stdio, SSE, and streamable HTTP transports.

The hustcc/mcp-mermaid MCP server is a focused choice for Mermaid-based visuals. It is not presented as a general charting, infographic, or image-generation server; the README lists those as separate tools for other visualization types.

_Full upstream README: https://allmcps.com/mcp/hustcc-mcp-mermaid/readme_