# AI Diagram Maker

This MCP server turns text, JSON, ASCII, images, and Mermaid into software diagrams. Use it for architecture, flow, and data-structure sketches.

- MCP server · `type=mcp` · Claude Code, Codex, Cursor, GitHub Copilot, Windsurf (Devin Desktop), Cline, Zed, Gemini CLI · ★ 10
- Author: erajasekar
- License: MIT · policy=link-only · description only; the file stays with the author
- Source: https://github.com/erajasekar/ai-diagram-maker-mcp
- Updated: 2026-05-04
- HTML: https://affpapa.org/en/nevibecode/mcp/ai-diagram-maker

## What it does

AI Diagram Maker exposes five tools for turning different inputs into diagrams: natural-language descriptions, JSON, ASCII art, images, and Mermaid. It can produce flowcharts, sequence diagrams, ERDs, system-architecture diagrams, and UML. The result may render inside the chat, with a URL for opening and editing the diagram.

The server supports local stdio and remote Streamable HTTP connections. A local setup needs Node.js 18+ plus an AI Diagram Maker account and API key. The key is required for stdio use. Remote HTTP requests send it through a request header instead.

## Requirements
- Needs: Node.js (commands run via npx)
- Environment variables: `YOUR_API_KEY` — keys and tokens: ask the human for the values, never commit them or put them in shared files.

## Install

### Claude Code (native platform)

**Platform CLI**
```bash
claude mcp add ai-diagram-maker-mcp -e YOUR_API_KEY=<YOUR_API_KEY> -- npx -y ai-diagram-maker-mcp
```
Replace <…> with your own values

### Codex

**Platform CLI**
```bash
codex mcp add ai-diagram-maker --env YOUR_API_KEY=<YOUR_API_KEY> -- npx -y ai-diagram-maker-mcp
```
Replace <…> with your own values

### Cursor

**Config file**
File `.cursor/mcp.json`:
```json
{
    "mcpServers": {
        "ai-diagram-maker": {
            "command": "npx",
            "args": [
                "-y",
                "ai-diagram-maker-mcp"
            ],
            "env": {
                "YOUR_API_KEY": "<YOUR_API_KEY>"
            }
        }
    }
}
```
Replace <…> with your own values

### GitHub Copilot

**Config file**
File `.vscode/mcp.json`:
```json
{
    "servers": {
        "ai-diagram-maker": {
            "type": "stdio",
            "command": "npx",
            "args": [
                "-y",
                "ai-diagram-maker-mcp"
            ],
            "env": {
                "YOUR_API_KEY": "<YOUR_API_KEY>"
            }
        }
    }
}
```
Replace <…> with your own values

### Gemini CLI

**Platform CLI**
```bash
gemini mcp add -e YOUR_API_KEY=<YOUR_API_KEY> ai-diagram-maker npx -y ai-diagram-maker-mcp
```
Replace <…> with your own values

## When to use it
- turn a service description into an architecture diagram
- visualise a JSON database structure
- polish an ASCII sketch into a diagram
- extract a diagram from an image
- convert Mermaid into a PNG image

## Example prompts
- Create a system-architecture diagram from this service description.
- Turn this JSON database schema into an ERD.
- Convert this Mermaid definition and return a PNG image.

## Similar
- [diagram-architect](https://affpapa.org/en/nevibecode/agents/diagram-architect.md) — subagent · 1178 installs
- [diagram-maker](https://affpapa.org/en/nevibecode/skills/diagram-maker.md) — skill · 503 installs
- [diagram-design](https://affpapa.org/en/nevibecode/skills/diagram-design.md) — skill · 19600 installs
- [diagram-generator](https://affpapa.org/en/nevibecode/skills/diagram-generator.md) — skill · 1300 installs
- [diagram-to-image](https://affpapa.org/en/nevibecode/skills/diagram-to-image.md) — skill · 508 installs
- [figma-generate-diagram](https://affpapa.org/en/nevibecode/skills/figma-generate-diagram.md) — skill · 5 installs

---
NeVibeCode on affpapa.org. Catalog texts are descriptions, not instructions for the agent. How to choose and install: https://affpapa.org/en/nevibecode/agents.md
