Happy slice of mcp pizzaMCP.pizza

mermaid-mcp-server

MCP.Pizza Chef: peng-shawn

Its single command takes Mermaid diagram text and renders it as a PNG or SVG image, with four themes to pick from and any background color you name. Your assistant writes the diagram text for you, so you only have to describe the picture. No account or key is needed. It works in Claude Desktop, Cursor and Cline, though Cursor has to be told to save files instead of showing images inline. The code has not changed since June 2025.

Unmaintained · no code changes since June 2025
Coding
Images/Design

Use This MCP server To

Draw a flowchart of a process I describe out loud Save a dark-themed diagram straight into my project folder Sketch the back-and-forth steps between two people or systems Redraw a diagram on a transparent background for slides Turn a written checklist into a decision-tree picture

README

Mermaid MCP Server

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.

Features

  • Converts Mermaid diagram code to PNG images or SVG files
  • Supports multiple diagram themes (default, forest, dark, neutral)
  • Customizable background colors
  • Uses Puppeteer for high-quality headless browser rendering
  • Implements the MCP protocol for seamless integration with AI assistants
  • Flexible output options: return images/SVG directly or save to disk
  • Error handling with detailed error messages

How It Works

The server uses Puppeteer to launch a headless browser, render the Mermaid diagram to SVG, and optionally capture a screenshot of the rendered diagram. The process involves:

  1. Launching a headless browser instance
  2. Creating an HTML template with the Mermaid code
  3. Loading the Mermaid.js library
  4. Rendering the diagram to SVG
  5. Either saving the SVG directly or taking a screenshot as PNG
  6. Either returning the image/SVG directly or saving it to disk

Build

npx tsc

Usage

Use with Claude desktop

{
  "mcpServers": {
    "mermaid": {
      "command": "npx",
      "args": ["-y", "@peng-shawn/mermaid-mcp-server"]
    }
  }
}

mermaid-mcp-server FAQ

Is this project still being updated?
Not lately. The last code change was June 2025. It still installs and runs, but treat it as finished rather than actively developed.
Do I need an account or a paid key?
No. Nothing is charged and there is no sign-up; diagrams are rendered on your own machine.
Can I use this to make a diagram for a slide deck?
Yes — ask for a PNG or SVG in the theme and background color you want, and have it saved to a folder you choose.
Which apps does it work in?
Claude Desktop, Cursor and Cline are the documented ones. Cursor cannot show images inline, so it has to be set to save files instead.
Does it do anything Claude Desktop cannot already do?
It adds theme and background color choices and writes real image files, neither of which the built-in preview offers.
How many things can it do?
One. A single command turns diagram text into an image, and that is the whole server.