Diagrams MCP

Generate cloud architecture diagrams, flowcharts, and sequence diagrams.

Quick Install

Automated & IDE Setup

Copy the AI prompt to install this server into Claude Code, Cursor, or another agent — or use 1-click editor setup below.

Add to Cursor Add to VS Code

Not yet automatically verified

We haven't yet run this listing's install command through our automated sandbox check. This isn't a red flag — we're steadily working through the catalog.

Manual Client & Custom JSON ConfigExpand JSON ▾

Client Config & Setup

Choose your client or environment

Target File:~/Library/Application Support/Claude/claude_desktop_config.json

claude_desktop_config.json

{
  "mcpServers": {
    "diagrams-mcp": {
      "command": "uvx",
      "args": [
        "diagrams-mcp-server"
      ]
    }
  }
}

💡 Paste the JSON block into your client's configuration file under mcpServers, then restart the application.

Documentation Overview

diagrams-mcp-server

MCP server for generating cloud architecture diagrams, flowcharts, sequence diagrams, and more — powered by three rendering engines: mingrammer/diagrams, Mermaid, and PlantUML.

Example diagram

Getting Started

Hosted (Recommended)

Connect to the public hosted server — no installation required. All rendering engines and dependencies are pre-installed.

Claude Desktop

Add to your claude_desktop_config.json (Settings → Developer → Edit Config):

config.json

{
  "mcpServers": {
    "diagrams-mcp": {
      "url": "https://diagrams-mcp-production.up.railway.app/mcp"
    }
  }
}

Claude Code (CLI)

Run:

Terminal

claude mcp add diagrams-mcp https://diagrams-mcp-production.up.railway.app/mcp

Or add to your .mcp.json:

config.json

{
  "mcpServers": {
    "diagrams-mcp": {
      "url": "https://diagrams-mcp-production.up.railway.app/mcp"
    }
  }
}

Cursor

Add to your .cursor/mcp.json:

config.json

{
  "mcpServers": {
    "diagrams-mcp": {
      "url": "https://diagrams-mcp-production.up.railway.app/mcp"
    }
  }
}

Windsurf

Add to your ~/.codeium/windsurf/mcp_config.json:

config.json

{
  "mcpServers": {
    "diagrams-mcp": {
      "serverUrl": "https://diagrams-mcp-production.up.railway.app/mcp"
    }
  }
}

VS Code

Add to your .vscode/mcp.json:

config.json

{
  "servers": {
    "diagrams-mcp": {
      "type": "http",
      "url": "https://diagrams-mcp-production.up.railway.app/mcp"
    }
  }
}

Local Installation

Prerequisites

Graphviz is required for the default local/in-process rendering mode. Mermaid CLI and PlantUML are optional — install them only if you need those specific rendering engines locally.

Dependency	Required for	Install
Graphviz	`render_diagram` (cloud architecture)	`brew install graphviz`
Mermaid CLI	`render_mermaid` (flowcharts, sequence, etc.)	`npm install -g @mermaid-js/mermaid-cli`
Java + PlantUML	`render_plantuml` (UML diagrams)	`brew install openjdk` + download plantuml.jar

Note: The hosted server runs as a slim MCP facade plus a separate renderer service, and has all render dependencies pre-installed in the renderer. Local prerequisites only apply if you're running in-process rendering yourself.

Install the server

Via uvx (recommended):

bash

uvx diagrams-mcp-server

Via pip:

Terminal

pip install diagrams-mcp-server

From source:

Terminal

pip install git+https://github.com/ByteOverDev/diagrams-mcp.git

Configure your MCP client

Claude Desktop

Add to your claude_desktop_config.json (Settings → Developer → Edit Config):

uvx (recommended):

config.json

{
  "mcpServers": {
    "diagrams-mcp": {
      "command": "uvx",
      "args": ["diagrams-mcp-server"]
    }
  }
}

pip:

config.json

{
  "mcpServers": {
    "diagrams-mcp": {
      "command": "diagrams-mcp-server"
    }
  }
}

Claude Code (CLI)

Run:

Terminal

claude mcp add diagrams-mcp -- uvx diagrams-mcp-server

Or add to your .mcp.json:

uvx (recommended):

config.json

{
  "mcpServers": {
    "diagrams-mcp": {
      "command": "uvx",
      "args": ["diagrams-mcp-server"]
    }
  }
}

pip:

config.json

{
  "mcpServers": {
    "diagrams-mcp": {
      "command": "diagrams-mcp-server"
    }
  }
}

Cursor

Add to your .cursor/mcp.json:

uvx (recommended):

config.json

{
  "mcpServers": {
    "diagrams-mcp": {
      "command": "uvx",
      "args": ["diagrams-mcp-server"]
    }
  }
}

pip:

config.json

{
  "mcpServers": {
    "diagrams-mcp": {
      "command": "diagrams-mcp-server"
    }
  }
}

Windsurf

Add to your ~/.codeium/windsurf/mcp_config.json:

uvx (recommended):

config.json

{
  "mcpServers": {
    "diagrams-mcp": {
      "command": "uvx",
      "args": ["diagrams-mcp-server"]
    }
  }
}

pip:

config.json

{
  "mcpServers": {
    "diagrams-mcp": {
      "command": "diagrams-mcp-server"
    }
  }
}

VS Code

Add to your .vscode/mcp.json:

uvx (recommended):

config.json

{
  "servers": {
    "diagrams-mcp": {
      "type": "stdio",
      "command": "uvx",
      "args": ["diagrams-mcp-server"]
    }
  }
}

pip:

config.json

{
  "servers": {
    "diagrams-mcp": {
      "type": "stdio",
      "command": "diagrams-mcp-server"
    }
  }
}

Available Tools

Discovery

list_providers() → list[str] — List all diagram providers (aws, gcp, k8s, azure, onprem, etc.)
list_services(provider) → list[str] — List service categories within a provider (e.g. aws → compute, database, network)
list_nodes(provider, service) → list[dict] — List node classes for a provider.service pair with import paths
search_nodes(query) → list[dict] — Search for nodes by keyword across all providers (e.g. "postgres", "lambda")

Rendering

render_diagram(code) → Image (PNG) — Execute a Python script using mingrammer/diagrams in a sandboxed subprocess. Returns a rendered cloud architecture diagram.
render_mermaid(definition) → Image (PNG/SVG) — Render a Mermaid diagram definition (flowcharts, sequence, class, ER, state, Gantt, and more).
render_plantuml(definition) → Image (PNG) — Render a PlantUML diagram definition (sequence, class, component, activity, state, deployment).

Cross-Provider Equivalence

find_equivalent(node, target_provider?) → dict — Find equivalent services across cloud providers (e.g. EC2 → ComputeEngine on GCP).
list_categories() → list[dict] — List all 30 infrastructure role categories with mapped nodes across providers.

Resources

The server provides reference documentation accessible via MCP resource URIs:

URI	Description
`diagrams://reference/diagram`	Diagram constructor parameters, defaults, and usage
`diagrams://reference/edge`	Edge operators, labels, styling, and chaining
`diagrams://reference/cluster`	Cluster nesting, styling, and graph attributes
`diagrams://reference/mermaid`	Mermaid syntax examples for 6 diagram types
`diagrams://reference/plantuml`	PlantUML syntax examples for 6 diagram types

Examples

Cloud Architecture (mingrammer/diagrams)

"Draw an AWS architecture with an ALB routing to two ECS services, backed by RDS and ElastiCache"

server.ts

from diagrams import Diagram, Cluster
from diagrams.aws.network import ALB
from diagrams.aws.compute import ECS
from diagrams.aws.database import RDS, ElastiCache

with Diagram("ECS Service", direction="LR"):
    lb = ALB("ALB")

    with Cluster("ECS Cluster"):
        services = [ECS("Web"), ECS("API")]

    lb >> services
    services[0] >> ElastiCache("Cache")
    services[1] >> RDS("Database")

Flowchart (Mermaid)

"Create a flowchart showing a CI/CD pipeline"

Mermaid flowchart

Sequence Diagram (PlantUML)

"Show the authentication flow between a client, API gateway, and auth service"

PlantUML sequence diagram

plantuml

@startuml
Client -> "API Gateway": POST /login
"API Gateway" -> "Auth Service": Validate credentials
"Auth Service" --> "API Gateway": JWT token
"API Gateway" --> Client: 200 OK + token
Client -> "API Gateway": GET /data (Bearer token)
"API Gateway" -> "Auth Service": Verify token
"Auth Service" --> "API Gateway": Valid
"API Gateway" --> Client: 200 OK + data
@enduml

Development

bash

# Clone and install
git clone https://github.com/ByteOverDev/diagrams-mcp.git
cd diagrams-mcp
pip install -e ".[dev]"

# Run tests
pytest

# Lint and format
ruff check .
ruff format .

# Run the MCP server locally (stdio mode)
diagrams-mcp-server

Split Facade/Renderer Mode

For hosted deployments, the MCP server can run as a lightweight facade that delegates render work to a separate renderer service. This keeps the always-on MCP process small while Graphviz, Chromium, Mermaid CLI, Java, and PlantUML live only in the renderer image.

bash

# Terminal 1: renderer service
RENDERER_HOST=0.0.0.0 RENDERER_PORT=8001 diagrams-renderer-server

# Terminal 2: HTTP MCP facade delegating to the renderer
FASTMCP_TRANSPORT=http \
FASTMCP_HOST=0.0.0.0 \
FASTMCP_PORT=8000 \
DIAGRAMS_RENDERER_MODE=remote \
DIAGRAMS_RENDERER_URL=http://127.0.0.1:8001 \
diagrams-mcp-server

Docker/Railway examples are included:

Read the full README →View source on GitHub →

Related MCP Servers

View all in Developer Tools View all alternatives

Reviews

No reviews yet — be the first to share how this listing worked for you.

Frequently Asked Questions about Diagrams MCP

Add the following block to your claude_desktop_config.json under mcpServers: "mcpServers": { "diagrams-mcp": { "command": "npx", "args": ["-y", "Diagrams MCP"] } }

AllMCPs Directory Badge

Full Badge Customizer

Showcase your server listing on GitHub or your project documentation. Embed this dynamic SVG badge to highlight official listing status and live engagement.

Badge Style:

Live Dynamic SVG Preview

Markdown (GitHub README)

[![AllMCPs](https://allmcps.com/api/badge/diagrams-mcp?style=directory)](https://allmcps.com/mcp/diagrams-mcp)

HTML Embed

<a href="https://allmcps.com/mcp/diagrams-mcp"><img src="https://allmcps.com/api/badge/diagrams-mcp?style=directory" alt="Diagrams MCP on AllMCPs" /></a>

Technical Specs & Signals

CategoryDeveloper Tools

36Quality signal: Fair · 36/100How this signal is calculated ▾

Server availabilityNot measured

Not scored for repo-hosted servers — we can't reach the running server, only its GitHub page. Hosted MCP endpoints are health-checked live.

Verified ownership10/20

Documentation & tools15/30

Adoption & activity2/15

Community engagement0/10

A guidance signal from public completeness & health data — not a user rating. New listings start lower and rise as they add docs, get verified, and grow adoption. Signals we can't observe for a listing are skipped, not counted against it.

★ Featured

AllMCPs Server

The official MCP server for AllMCPs.com - submit and manage tools directly from your AI. The open directory for MCP servers. Connect Claude, Cursor, Windsurf, and AI agents to databases, tools, files, and APIs. Explore 10,000+ servers. AllMCPs is the premier, open directory for discovering, evaluating, and installing Model Context Protocol (MCP) servers to equip AI agents and LLMs with real-world superpowers.

Explore Server →

Own this project?

This directory is pre-filled from public sources. Claim via GitHub README, site badge, or DNS TXT to unlock edit access and the Official badge — proof is checked automatically, then reviewed by our team.

Free dofollow backlink: add your website and place the AllMCPs badge on it — no claim needed. We detect it automatically and keep it verified as long as the badge stays live.

Claim & get free dofollow

Share & Embed

Add our SVG badge (dark/light directory styles) or embeddable widget to your site.

Explore more

More in 💻 Developer Tools →Best MCP servers for Developers →Alternatives to Diagrams MCP →Install in Claude Desktop Install in Cursor Install in VS Code

Diagrams MCP

Generate cloud architecture diagrams, flowcharts, and sequence diagrams.

Quick Install

Automated & IDE Setup

Copy the AI prompt to install this server into Claude Code, Cursor, or another agent — or use 1-click editor setup below.

Add to Cursor Add to VS Code

Not yet automatically verified

We haven't yet run this listing's install command through our automated sandbox check. This isn't a red flag — we're steadily working through the catalog.

Manual Client & Custom JSON ConfigExpand JSON ▾

Client Config & Setup

Choose your client or environment

Target File:~/Library/Application Support/Claude/claude_desktop_config.json

claude_desktop_config.json

{
  "mcpServers": {
    "diagrams-mcp": {
      "command": "uvx",
      "args": [
        "diagrams-mcp-server"
      ]
    }
  }
}

💡 Paste the JSON block into your client's configuration file under mcpServers, then restart the application.

Documentation Overview

diagrams-mcp-server

MCP server for generating cloud architecture diagrams, flowcharts, sequence diagrams, and more — powered by three rendering engines: mingrammer/diagrams, Mermaid, and PlantUML.

Example diagram

Getting Started

Hosted (Recommended)

Connect to the public hosted server — no installation required. All rendering engines and dependencies are pre-installed.

Claude Desktop

Add to your claude_desktop_config.json (Settings → Developer → Edit Config):

config.json

{
  "mcpServers": {
    "diagrams-mcp": {
      "url": "https://diagrams-mcp-production.up.railway.app/mcp"
    }
  }
}

Claude Code (CLI)

Run:

Terminal

claude mcp add diagrams-mcp https://diagrams-mcp-production.up.railway.app/mcp

Or add to your .mcp.json:

config.json

{
  "mcpServers": {
    "diagrams-mcp": {
      "url": "https://diagrams-mcp-production.up.railway.app/mcp"
    }
  }
}

Cursor

Add to your .cursor/mcp.json:

config.json

{
  "mcpServers": {
    "diagrams-mcp": {
      "url": "https://diagrams-mcp-production.up.railway.app/mcp"
    }
  }
}

Windsurf

Add to your ~/.codeium/windsurf/mcp_config.json:

config.json

{
  "mcpServers": {
    "diagrams-mcp": {
      "serverUrl": "https://diagrams-mcp-production.up.railway.app/mcp"
    }
  }
}

VS Code

Add to your .vscode/mcp.json:

config.json

{
  "servers": {
    "diagrams-mcp": {
      "type": "http",
      "url": "https://diagrams-mcp-production.up.railway.app/mcp"
    }
  }
}

Local Installation

Prerequisites

Graphviz is required for the default local/in-process rendering mode. Mermaid CLI and PlantUML are optional — install them only if you need those specific rendering engines locally.

Dependency	Required for	Install
Graphviz	`render_diagram` (cloud architecture)	`brew install graphviz`
Mermaid CLI	`render_mermaid` (flowcharts, sequence, etc.)	`npm install -g @mermaid-js/mermaid-cli`
Java + PlantUML	`render_plantuml` (UML diagrams)	`brew install openjdk` + download plantuml.jar

Note: The hosted server runs as a slim MCP facade plus a separate renderer service, and has all render dependencies pre-installed in the renderer. Local prerequisites only apply if you're running in-process rendering yourself.

Install the server

Via uvx (recommended):

bash

uvx diagrams-mcp-server

Via pip:

Terminal

pip install diagrams-mcp-server

From source:

Terminal

pip install git+https://github.com/ByteOverDev/diagrams-mcp.git

Configure your MCP client

Claude Desktop

Add to your claude_desktop_config.json (Settings → Developer → Edit Config):

uvx (recommended):

config.json

{
  "mcpServers": {
    "diagrams-mcp": {
      "command": "uvx",
      "args": ["diagrams-mcp-server"]
    }
  }
}

pip:

config.json

{
  "mcpServers": {
    "diagrams-mcp": {
      "command": "diagrams-mcp-server"
    }
  }
}

Claude Code (CLI)

Run:

Terminal

claude mcp add diagrams-mcp -- uvx diagrams-mcp-server

Or add to your .mcp.json:

uvx (recommended):

config.json

{
  "mcpServers": {
    "diagrams-mcp": {
      "command": "uvx",
      "args": ["diagrams-mcp-server"]
    }
  }
}

pip:

config.json

{
  "mcpServers": {
    "diagrams-mcp": {
      "command": "diagrams-mcp-server"
    }
  }
}

Cursor

Add to your .cursor/mcp.json:

uvx (recommended):

config.json

{
  "mcpServers": {
    "diagrams-mcp": {
      "command": "uvx",
      "args": ["diagrams-mcp-server"]
    }
  }
}

pip:

config.json

{
  "mcpServers": {
    "diagrams-mcp": {
      "command": "diagrams-mcp-server"
    }
  }
}

Windsurf

Add to your ~/.codeium/windsurf/mcp_config.json:

uvx (recommended):

config.json

{
  "mcpServers": {
    "diagrams-mcp": {
      "command": "uvx",
      "args": ["diagrams-mcp-server"]
    }
  }
}

pip:

config.json

{
  "mcpServers": {
    "diagrams-mcp": {
      "command": "diagrams-mcp-server"
    }
  }
}

VS Code

Add to your .vscode/mcp.json:

uvx (recommended):

config.json

{
  "servers": {
    "diagrams-mcp": {
      "type": "stdio",
      "command": "uvx",
      "args": ["diagrams-mcp-server"]
    }
  }
}

pip:

config.json

{
  "servers": {
    "diagrams-mcp": {
      "type": "stdio",
      "command": "diagrams-mcp-server"
    }
  }
}

Available Tools

Discovery

list_providers() → list[str] — List all diagram providers (aws, gcp, k8s, azure, onprem, etc.)
list_services(provider) → list[str] — List service categories within a provider (e.g. aws → compute, database, network)
list_nodes(provider, service) → list[dict] — List node classes for a provider.service pair with import paths
search_nodes(query) → list[dict] — Search for nodes by keyword across all providers (e.g. "postgres", "lambda")

Rendering

render_diagram(code) → Image (PNG) — Execute a Python script using mingrammer/diagrams in a sandboxed subprocess. Returns a rendered cloud architecture diagram.
render_mermaid(definition) → Image (PNG/SVG) — Render a Mermaid diagram definition (flowcharts, sequence, class, ER, state, Gantt, and more).
render_plantuml(definition) → Image (PNG) — Render a PlantUML diagram definition (sequence, class, component, activity, state, deployment).

Cross-Provider Equivalence

find_equivalent(node, target_provider?) → dict — Find equivalent services across cloud providers (e.g. EC2 → ComputeEngine on GCP).
list_categories() → list[dict] — List all 30 infrastructure role categories with mapped nodes across providers.

Resources

The server provides reference documentation accessible via MCP resource URIs:

URI	Description
`diagrams://reference/diagram`	Diagram constructor parameters, defaults, and usage
`diagrams://reference/edge`	Edge operators, labels, styling, and chaining
`diagrams://reference/cluster`	Cluster nesting, styling, and graph attributes
`diagrams://reference/mermaid`	Mermaid syntax examples for 6 diagram types
`diagrams://reference/plantuml`	PlantUML syntax examples for 6 diagram types

Examples

Cloud Architecture (mingrammer/diagrams)

"Draw an AWS architecture with an ALB routing to two ECS services, backed by RDS and ElastiCache"

server.ts

from diagrams import Diagram, Cluster
from diagrams.aws.network import ALB
from diagrams.aws.compute import ECS
from diagrams.aws.database import RDS, ElastiCache

with Diagram("ECS Service", direction="LR"):
    lb = ALB("ALB")

    with Cluster("ECS Cluster"):
        services = [ECS("Web"), ECS("API")]

    lb >> services
    services[0] >> ElastiCache("Cache")
    services[1] >> RDS("Database")

Flowchart (Mermaid)

"Create a flowchart showing a CI/CD pipeline"

Mermaid flowchart

Sequence Diagram (PlantUML)

"Show the authentication flow between a client, API gateway, and auth service"

PlantUML sequence diagram

plantuml

@startuml
Client -> "API Gateway": POST /login
"API Gateway" -> "Auth Service": Validate credentials
"Auth Service" --> "API Gateway": JWT token
"API Gateway" --> Client: 200 OK + token
Client -> "API Gateway": GET /data (Bearer token)
"API Gateway" -> "Auth Service": Verify token
"Auth Service" --> "API Gateway": Valid
"API Gateway" --> Client: 200 OK + data
@enduml

Development

bash

# Clone and install
git clone https://github.com/ByteOverDev/diagrams-mcp.git
cd diagrams-mcp
pip install -e ".[dev]"

# Run tests
pytest

# Lint and format
ruff check .
ruff format .

# Run the MCP server locally (stdio mode)
diagrams-mcp-server

Split Facade/Renderer Mode

bash

# Terminal 1: renderer service
RENDERER_HOST=0.0.0.0 RENDERER_PORT=8001 diagrams-renderer-server

# Terminal 2: HTTP MCP facade delegating to the renderer
FASTMCP_TRANSPORT=http \
FASTMCP_HOST=0.0.0.0 \
FASTMCP_PORT=8000 \
DIAGRAMS_RENDERER_MODE=remote \
DIAGRAMS_RENDERER_URL=http://127.0.0.1:8001 \
diagrams-mcp-server

Docker/Railway examples are included:

Read the full README →View source on GitHub →

Related MCP Servers

View all in Developer Tools View all alternatives

Reviews

No reviews yet — be the first to share how this listing worked for you.

Frequently Asked Questions about Diagrams MCP

Add the following block to your claude_desktop_config.json under mcpServers: "mcpServers": { "diagrams-mcp": { "command": "npx", "args": ["-y", "Diagrams MCP"] } }

AllMCPs Directory Badge

Full Badge Customizer

Showcase your server listing on GitHub or your project documentation. Embed this dynamic SVG badge to highlight official listing status and live engagement.

Badge Style:

Live Dynamic SVG Preview

Markdown (GitHub README)

[![AllMCPs](https://allmcps.com/api/badge/diagrams-mcp?style=directory)](https://allmcps.com/mcp/diagrams-mcp)

HTML Embed

<a href="https://allmcps.com/mcp/diagrams-mcp"><img src="https://allmcps.com/api/badge/diagrams-mcp?style=directory" alt="Diagrams MCP on AllMCPs" /></a>

Technical Specs & Signals

CategoryDeveloper Tools

36Quality signal: Fair · 36/100How this signal is calculated ▾

Server availabilityNot measured

Not scored for repo-hosted servers — we can't reach the running server, only its GitHub page. Hosted MCP endpoints are health-checked live.

Verified ownership10/20

Documentation & tools15/30

Adoption & activity2/15

Community engagement0/10

★ Featured

AllMCPs Server

Explore Server →

Own this project?

Free dofollow backlink: add your website and place the AllMCPs badge on it — no claim needed. We detect it automatically and keep it verified as long as the badge stays live.

Claim & get free dofollow

Share & Embed

Add our SVG badge (dark/light directory styles) or embeddable widget to your site.

Explore more

More in 💻 Developer Tools →Best MCP servers for Developers →Alternatives to Diagrams MCP →Install in Claude Desktop Install in Cursor Install in VS Code