Skip to content
appsgit

Claude Mermaid

Claude Mermaid is an MCP server that adds developer tools to AI assistants such as Claude Desktop, Claude Code and Cursor. MCP Server to previewing mermaid diagrams with live reload. It has 214 GitHub stars, is released under the MIT license and runs locally with npx -y claude-mermaid.

github.com/veelenga/claude-mermaid (opens in a new tab)

View on GitHub (opens in a new tab)

Install Claude Mermaid

Generated from the server's published package. Replace your-value with your own values.

Claude Desktop

claude_desktop_config.json
{
  "mcpServers": {
    "claude-mermaid": {
      "command": "npx",
      "args": [
        "-y",
        "claude-mermaid"
      ],
      "env": {
        "CLAUDE_MERMAID_LOG_LEVEL": "your-value"
      }
    }
  }
}

Settings > Developer > Edit Config. macOS: ~/Library/Application Support/Claude/, Windows: %APPDATA%\Claude\. Restart Claude Desktop afterwards.

Claude Code

claude mcp add --env CLAUDE_MERMAID_LOG_LEVEL=your-value --transport stdio claude-mermaid -- npx -y claude-mermaid

Cursor

.cursor/mcp.json
{
  "mcpServers": {
    "claude-mermaid": {
      "type": "stdio",
      "command": "npx",
      "args": [
        "-y",
        "claude-mermaid"
      ],
      "env": {
        "CLAUDE_MERMAID_LOG_LEVEL": "your-value"
      }
    }
  }
}

Project file; use ~/.cursor/mcp.json to enable it in every project.

VS Code

.vscode/mcp.json
{
  "servers": {
    "claude-mermaid": {
      "type": "stdio",
      "command": "npx",
      "args": [
        "-y",
        "claude-mermaid"
      ],
      "env": {
        "CLAUDE_MERMAID_LOG_LEVEL": "your-value"
      }
    }
  }
}

Config formats checked against the official docs on Oct 7, 2026: modelcontextprotocol.io (opens in a new tab), code.claude.com (opens in a new tab), cursor.com (opens in a new tab), code.visualstudio.com (opens in a new tab).

Environment variables

Variables the server reads at startup.

NameRequiredDescription
CLAUDE_MERMAID_LOG_LEVELNoShown in the README's example configuration.

About Claude Mermaid

MCP server for rendering Mermaid diagrams in Claude Code with live reload functionality and a built-in skill for expert guidance.

  • claude-code
  • mcp-server

Similar MCP servers

More developer tools MCP servers

All Developer tools

FAQ

Claude Mermaid FAQ

Still curious? Email info@appsgit.com.

What is Claude Mermaid?

Claude Mermaid is an MCP server that adds developer tools to AI assistants such as Claude Desktop, Claude Code and Cursor. MCP Server to previewing mermaid diagrams with live reload. It has 214 GitHub stars, is released under the MIT license and runs locally with npx -y claude-mermaid. The source code is at github.com/veelenga/claude-mermaid.

How do I install the Claude Mermaid MCP server?

Add the command npx -y claude-mermaid to your MCP client: put it in claude_desktop_config.json for Claude Desktop, run claude mcp add for Claude Code, or add it to .cursor/mcp.json (Cursor) or .vscode/mcp.json (VS Code). The snippets on this page are ready to paste.

Is Claude Mermaid free?

The server is open source under the MIT license, so running it is free. It does not declare any required API key.

Is Claude Mermaid actively maintained?

The most recent commit was on Oct 5, 2026. appsgit only lists MCP servers with a commit in the last six months and re-checks every server daily.