A Model Context Protocol (MCP) server that converts Mermaid diagrams to PNG images
A Model Context Protocol (MCP) server that converts Mermaid diagrams to PNG images. The mermaid mcp server wraps that behind the Model Context Protocol, so an assistant can use it through 7 defined tools rather than through you.
A Model Context Protocol (MCP) server that converts Mermaid diagrams to PNG images or SVG files. This server allows AI assistants and other applications to generate visual diagrams from textual descriptions using the Mermaid markdown syntax.
tsc on npm is all you need. Most clients run it directly, so configuration is a few lines and a restart.
Everything the assistant can do here goes through one of these:
generate — Converts Mermaid diagram code to a PNG image or SVG fileParameters — - code: The Mermaid diagram code to rendertheme — (optional) Theme for the diagram. Options: "default", "forest", "dark", "neutral"backgroundColor — (optional) Background color for the diagram, e.g. 'white', 'transparent', '#F0F0F0'outputFormat — (optional) Output format for the diagram. Options: "png", "svg" (defaults to "png")name — Name for the generated file (required when CONTENT_IMAGE_SUPPORTED=false)folder — Absolute path to save the image/SVG to (required when CONTENT_IMAGE_SUPPORTED=false)You will need one environment variable: PUPPETEER_EXECUTABLE_PATH. Keep credentials in your client's env block or a secrets manager rather than in a file you might commit.
This sits in the developer tooling group, where several servers overlap in what they claim to do but differ sharply once you actually set them up. Mermaid's toolset — generate, Parameters, theme and 4 more — is a fair guide to whether it matches your workflow. It is maintained by shapeng; worth a glance at recent repository activity before you build anything load-bearing on it.
We check each listing at SyncDev against the project's documentation before it goes live — if something here drifts out of date, it is a bug worth reporting.
| Tool | What it does |
|---|---|
| generate | Converts Mermaid diagram code to a PNG image or SVG file |
| Parameters | - code: The Mermaid diagram code to render |
| theme | (optional) Theme for the diagram. Options: "default", "forest", "dark", "neutral" |
| backgroundColor | (optional) Background color for the diagram, e.g. 'white', 'transparent', '#F0F0F0' |
| outputFormat | (optional) Output format for the diagram. Options: "png", "svg" (defaults to "png") |
| name | Name for the generated file (required when CONTENT_IMAGE_SUPPORTED=false) |
| folder | Absolute path to save the image/SVG to (required when CONTENT_IMAGE_SUPPORTED=false) |
## Usage
### Use with Claude desktop
```json
{
"mcpServers": {
"mermaid": {
"command": "npx",
"args": ["-y", "@peng-shawn/mermaid-mcp-server"]
}
}
}Configuration as documented by the project. Restart the client after saving.
| Variable | Description | Required |
|---|---|---|
| PUPPETEER_EXECUTABLE_PATH | Filesystem location the server is allowed to use. | Optional |
Kill hallucinated APIs — version-accurate, up-to-date library documentation injected straight into context.
Microsoft's official browser automation server — drive a real browser through the accessibility tree, no screenshots needed.
GitHub's official server — repos, issues, pull requests, Actions and code security, straight from your assistant.
Issue tracking at the speed of conversation — Linear's official hosted server with OAuth and zero install.
Local repository surgery — status, diffs, commits, branches and history for any repo on disk.
Timezone sanity for AI — current time anywhere and correct conversions, without the model doing date math.