Mermaid

Mermaid MCP Server lets you connect through MCP-compatible clients to input text descriptions, Mermaid code, or structured text and receive high-quality flowchart visuals rendered as HTML and PNGs. It streamlines diagram generation by handling interpretation, rendering, and export in a single MCP workflow, so you can focus on describing your diagram needs and obtaining polished visuals quickly.

How to use

Connect your MCP-enabled client to the local server and start generating diagrams from plain language descriptions, Mermaid code, or structured text. Once connected, you can describe a diagram you want, paste Mermaid snippets, or provide structured steps, and the server will produce a ready-to-export diagram as HTML/CSS and a PNG image.

How to install

Prerequisites: you need Python 3.8 or newer and pip installed on your system. You also need an MCP-capable client to connect to the server.

# Clone the project
git clone https://github.com/yourusername/mermaid-mcp.git
cd mermaid-mcp

# Create and activate a virtual environment (recommended)
python -m venv venv
source venv/bin/activate  # Linux/macOS
# Windows:
venv\Scripts\activate

# Install dependencies
pip install -r requirements.txt

# Start the MCP server (stdio configuration)
python src/server.py

Configuration and operation notes

The server exposes an HTTP endpoint for remote MCP clients and also supports local stdio startup. To run locally via stdio, start the Python server as shown above and ensure your MCP client is configured to connect to the appropriate channel.

Additional notes

• You can choose or customize CSS templates to alter the diagram’s look and feel. Options include default, dark, and other visual styles to fit your presentation needs.

• The server supports exporting generated diagrams as high-quality PNG images in addition to serving the HTML/CSS visualization.

Security and troubleshooting

Run the server on a trusted machine and secure any exposed MCP endpoints if you enable remote access. If you encounter issues connecting from a client, verify that the server process is running, and that the client is configured to point to the correct local URL or socket.

Available tools

HTML/CSS rendering

Generates an HTML page with CSS styling to visually render the diagram directly in the browser or via an embedded viewer.

PNG export

Exports the rendered HTML diagram to a high-quality PNG image for use in documents and presentations.

CSS template support

Allows choosing predefined CSS templates or applying custom CSS to style the diagram.

MCP client integration

Operates over the MCP protocol to communicate with any MCP-compatible client for input and output.

LLM-driven interpretation

Uses language models to understand user intent and generate the appropriate HTML/CSS for the diagram.