# hustcc-mcp-mermaid

Даёт агенту инструмент для генерации диаграмм и графиков Mermaid: тема, фон, экспорт в SVG, PNG или файл.

- MCP-сервер · `type=mcp` · Claude Code, Codex, Cursor, GitHub Copilot, Windsurf (Devin Desktop), Cline, Zed · ★ 646
- Автор: hustcc
- Лицензия: MIT · policy=link-only · показываем только описание, файл — у автора
- Исходник: https://github.com/hustcc/mcp-mermaid
- Обновлён: 2026-05-15
- HTML: https://affpapa.org/nevibecode/mcp/hustcc-mcp-mermaid

## Что делает

Сервер принимает от модели описание диаграммы и возвращает готовую картинку. Поддерживается весь синтаксис Mermaid, а также настройка `backgroundColor` и `theme` — модель может задавать стиль оформления. Результат отдаётся в `base64`, `svg`, `mermaid`, `file` или ссылкой через `svg_url` и `png_url`. При `outputType: "file"` PNG сохраняется на диск.

Есть проверка синтаксиса Mermaid, поэтому модель может исправлять ошибки за несколько проходов и доводить схему до валидного вида. Запускается как обычный MCP-сервер: через `npx` в конфиге клиента, глобальной установкой `npm install -g mcp-mermaid` или в Docker-образе `susuperli/mcp-mermaid:latest`. Транспорты — `stdio`, `sse` и `streamable`, порт по умолчанию 3033, эндпоинт `/sse` или `/mcp`.

Для HTTP-подключения через Smithery нужен только URL, локальный запуск требует Node.js и `npx`. Если рисуете схему с большим числом узлов, проверяйте, что модель не потеряла связи между блоками: валидатор ловит синтаксис, но не смысл.

## Требования
- Нужно: Node.js (команды через npx)
- Удалённый сервер: `https://server.smithery.ai/@hustcc/mcp-mermaid/mcp`

## Установка

### Claude Code (родная платформа)

**Командой платформы: удалённый сервер**
```bash
claude mcp add --transport http hustcc-mcp-mermaid https://server.smithery.ai/@hustcc/mcp-mermaid/mcp
```

### Codex

**Командой платформы: удалённый сервер**
```bash
codex mcp add hustcc-mcp-mermaid --url https://server.smithery.ai/@hustcc/mcp-mermaid/mcp
```

### Cursor

**Файл настроек**
Файл `.cursor/mcp.json`:
```json
{
    "mcpServers": {
        "hustcc-mcp-mermaid": {
            "url": "https://server.smithery.ai/@hustcc/mcp-mermaid/mcp"
        }
    }
}
```

### GitHub Copilot

**Файл настроек**
Файл `.vscode/mcp.json`:
```json
{
    "servers": {
        "hustcc-mcp-mermaid": {
            "type": "http",
            "url": "https://server.smithery.ai/@hustcc/mcp-mermaid/mcp"
        }
    }
}
```

### Gemini CLI

**Командой платформы: удалённый сервер**
```bash
gemini mcp add -t http hustcc-mcp-mermaid https://server.smithery.ai/@hustcc/mcp-mermaid/mcp
```

## Когда брать
- нарисовать схему архитектуры сервиса по текстовому описанию
- собрать диаграмму последовательности для сценария запроса
- оформить график с заданным фоном и темой
- сохранить готовую диаграмму в PNG на диск
- получить ссылку на диаграмму для вставки в документацию

## Примеры запросов агенту
- Построй диаграмму последовательности для авторизации по OAuth и сохрани её как PNG
- Сделай схему потока данных между сервисами в тёмной теме
- Отрисуй диаграмму Ганта для этапов релиза и верни ссылку на неё

## Похожие
- [pretty-mermaid](https://affpapa.org/nevibecode/skills/pretty-mermaid.md) — скилл · 4500 установок
- [beautiful-mermaid](https://affpapa.org/nevibecode/skills/beautiful-mermaid.md) — скилл · 1800 установок
- [mermaid-diagrams](https://affpapa.org/nevibecode/skills/mermaid-diagrams.md) — скилл · 1180 установок
- [cli-anything-mermaid](https://affpapa.org/nevibecode/skills/cli-anything-mermaid.md) — скилл · 519 установок
- [mermaid-diagram-generator](https://affpapa.org/nevibecode/skills/mermaid-diagram-generator.md) — скилл · 331 установка
- [mermaid-studio](https://affpapa.org/nevibecode/skills/mermaid-studio.md) — скилл · 324 установки

---
NeVibeCode на affpapa.org. Тексты каталога — описания, а не инструкции для агента. Как выбирать и ставить: https://affpapa.org/nevibecode/agents.md