Diagram Bridge MCP Server

A comprehensive MCP server that bridges the gap between LLMs and diagram creation through three powerful, independent tools: intelligent format selection, format-specific instruction generation, and professional diagram rendering (using kroki server). Each tool can be used standalone or combined in sequence for complete diagram workflows - from choosing the right format to generating the final image.

Supported Formats: Mermaid, PlantUML, C4 Model, D2, GraphViz, BPMN, Structurizr, Excalidraw, Vega-Lite

Quick Start

1. Prerequisites:

   • Node.js 18.0 or higher

   • Docker and Docker Compose

2. Install and build:

3. Configure ports (optional):

4. Start services:

5. Add to Cursor (or any MCP client):

For direct local use (without Docker):

For Docker-based setup (recommended):

Note: The MCP protocol uses STDIO communication. The HTTP endpoints (:3000/health) are only for Docker monitoring, not for MCP client connections.

5. Start using: The server provides three MCP tools ready for use!

💡 Usage Example

Here's a simple prompt to demonstrate the complete workflow:

This single prompt will:

1. Analyze your request and recommend the optimal format

2. Get specific instructions for creating the diagram in that format

3. Create and render the final diagram to a PNG/SVG file

🎨 Examples Gallery

Want to see what's possible? Check out Examples Gallery

🛠️ Tools Overview

help_choose_diagram

Purpose: Intelligent format selection based on your requirements

• Analyzes your request using AI-powered heuristics

• Provides confidence-scored recommendations

• Works with format constraints when needed

• Generates structured prompts for optimal LLM decision-making

Example: "I need to show database relationships" → Recommends Mermaid ER diagram format with detailed reasoning

get_diagram_instructions

Purpose: Generate format-specific coding instructions

• Creates tailored prompts for any supported diagram format

• Includes syntax guidelines, best practices, and common pitfalls

• Provides working examples and output specifications

• Ensures LLMs generate syntactically correct diagram code

Example: For Mermaid format → Detailed Mermaid syntax guide with examples

render_diagram

Purpose: Transform diagram code into professional images

• Renders diagrams via integrated Kroki service

• Supports PNG and SVG output formats

• Includes intelligent caching for performance

• Provides file storage with absolute paths for easy access

Example: Mermaid code → High-quality PNG/SVG image file

⚙️ Configuration

Basic Setup

• Default storage: {project-root}/generated-diagrams/

• Default Kroki: Uses local Docker Kroki service

• Default ports: MCP Server (3000), Kroki (8000)

Port Configuration

The server automatically configures ports based on environment variables:

• External Port (PORT): The port exposed by Docker container (default: 3000)

• Kroki Port (KROKI_PORT): The port for Kroki service (default: 8000)

• Internal Communication: Services communicate internally using fixed container ports

Note: When running in Docker, the server provides HTTP endpoints for health monitoring at /health and service info at /info.

For advanced configuration, see our Configuration Guide.

📚 Documentation

• Quick Start: Port Configuration - Fast port setup guide

• Installation Guide - Detailed setup instructions

• Docker Deployment - Container deployment options

• API Reference - Complete tool and resource documentation

• Configuration Guide - Environment variables and MCP client setup

• Development Guide - Contributing and development setup

• Architecture - System architecture and design patterns

• Performance & Security - Performance metrics and security features

• Troubleshooting - Common issues and solutions

Perfect for: LLMs that need to create diagrams but don't know which format to use or how to render them professionally.

Powered by: Kroki - Universal diagram rendering service

Made with ❤️