https://github.com/myxvisual/mermaid-mcp-server
https://github.com/myxvisual/mermaid-mcp-server
Last synced: 10 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/myxvisual/mermaid-mcp-server
- Owner: myxvisual
- Created: 2025-06-19T16:20:47.000Z (about 1 year ago)
- Default Branch: master
- Last Pushed: 2025-06-19T17:01:12.000Z (about 1 year ago)
- Last Synced: 2025-06-19T17:43:10.639Z (about 1 year ago)
- Language: TypeScript
- Size: 99.6 KB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# 🧜♀️ mermaid-mcp-server
A simple and robust MCP server providing live information about Mermaid.js diagrams.
This is a TypeScript-based [MCP TypeScript SDK](https://github.com/modelcontextprotocol/typescript-sdk) server that provides access to Mermaid diagram information. It exposes a set of tools to discover and retrieve details about the various diagram types supported by Mermaid.
## 🚀 How It Works
A client can connect to this server and use the provided tools to query information. For example, a client might first list all available diagrams and then request specific details or examples for one of them.
Here is a mindmap summarizing the server's purpose, tools, and a typical interaction flow:
```mermaid
mindmap
root((🧜♀️ mermaid-mcp-server))
::icon(fa fa-server)
Core Purpose
::icon(fa fa-bullseye)
Provide Mermaid.js Info
Uses Model Context Protocol (MCP)
Available Tools
::icon(fa fa-toolbox)
about
list_diagrams
get_diagram
get_diagram_examples
Client Interaction Flow
::icon(fa fa-cogs)
1. Connect to Server
2. Query with Tools
Discover diagrams
(list_diagrams)
Fetch details
(get_diagram)
Get examples
(get_diagram_examples)
Technology
::icon(fa fa-code)
TypeScript
Node.js
```
## 📦 Configuring with Claude
To use an MCP server with Claude, add it to your configuration:
```json
{
"mcpServers": {
"mermaid-mcp-server": {
"command": "npx",
"args": [
"-y",
"mermaid-mcp-server",
]
}
}
}
```
## 🛠️ Tools
The server exposes the following tools via MCP:
| Tool Name | Description | Parameters |
| ---------------------- | -------------------------------------------------------------------- | ----------------------------------------------------------------------- |
| `about` | Provides a general description of the Mermaid project. | _None_ |
| `list_diagrams` | Lists all available Mermaid diagram types. | _None_ |
| `get_diagram` | Gets detailed information about a specific diagram type. | `diagramType: string`
(e.g., "flowchart", "sequenceDiagram") |
| `get_diagram_examples` | Gets one or more syntax examples for a specific diagram type. | `diagramType: string`
(e.g., "flowchart", "sequenceDiagram") |
## 💻 Development
To get started with development, follow these steps:
1. **Clone the repository:**
```bash
git clone https://github.com/myxvisual/mermaid-mcp-server
cd mermaid-mcp-server
```
2. **Install dependencies:**
```bash
npm install
```
3. **Build for production:**
```bash
npm run build
```