draw.io MCP: схемы и диаграммы агентом в Claude, Codex и Cursor

jgraph/drawio-mcp· Проверено 12.11.2026· 5,8 тыс.на GitHub

Агент рисует блок-схемы, схемы процессов и архитектуры в draw.io: из XML, Mermaid или CSV, с иконками AWS, Azure, GCP и Cisco. Диаграмма открывается в редакторе или прямо в чате.

4 реализации:

Удалённый сервер от авторов draw.io: ставить ничего не нужно, в клиентах с MCP Apps диаграмма показывается прямо в чате с кнопкой «Open in draw.io».

Как подключить

Что сделать до подключения

Клиент с удалёнными MCP-серверами: Claude.ai, ChatGPT, VS Code с GitHub Copilot, Cursor, GitHub Copilot CLI; в Claude.ai draw.io есть в каталоге коннекторов

Конфиг для вашего клиента

Команда в терминале, в папке проекта. Флаг --scope user подключит сервер для всех проектов. Подробно о Claude Code

claude mcp add --transport http draw-io https://mcp.draw.io/mcp

Проверка: claude mcp list показывает статус рядом с каждым сервером: ✔ Connected, ! Needs authentication или ✘ Failed to connect. Внутри сессии то же видно по команде /mcp.

Файл ~/.codex/config.toml или .codex/config.toml в доверенном проекте. Можно и командой codex mcp add. Подробно о Codex

[mcp_servers.draw-io]
url = "https://mcp.draw.io/mcp"

Проверка: В интерфейсе codex введите /mcp: появится список активных серверов. Из терминала то же покажет codex mcp list.

Файл ~/.cursor/mcp.json для всех проектов или .cursor/mcp.json в папке проекта. Подробно о Cursor

{
  "mcpServers": {
    "draw-io": {
      "url": "https://mcp.draw.io/mcp"
    }
  }
}

Проверка: Откройте Customize в боковой панели: там список серверов с переключателями. Ошибки подключения смотрите в панели Output (Cmd+Shift+U), пункт MCP Logs в выпадающем списке.

Файл .mcp.json в корне проекта или ~/.copilot/mcp-config.json для всех проектов. Подробно о VS Code

{
  "mcpServers": {
    "draw-io": {
      "type": "http",
      "url": "https://mcp.draw.io/mcp"
    }
  }
}

Проверка: Попросите Copilot выполнить безобидную задачу через сервер и раскройте вызов инструмента в чате. Одна запись в конфиге подключение не подтверждает.

Файл ~/.qwen/settings.json или .qwen/settings.json в проекте. Подробно о Qwen Code

{
  "mcpServers": {
    "draw-io": {
      "httpUrl": "https://mcp.draw.io/mcp"
    }
  }
}

Проверка: Запустите qwen и введите /mcp: откроется окно управления серверами. Из терминала статус покажет qwen mcp list.

Файл ~/.gemini/settings.json или .gemini/settings.json в проекте. Подробно о Gemini CLI

{
  "mcpServers": {
    "draw-io": {
      "httpUrl": "https://mcp.draw.io/mcp"
    }
  }
}

Проверка: gemini mcp list показывает каждый сервер, его настройки и статус Connected или Disconnected. В сессии /mcp выводит CONNECTED, CONNECTING или DISCONNECTED и список инструментов.

Файл opencode.json в папке проекта или ~/.config/opencode/opencode.json. Подробно о OpenCode

{
  "$schema": "https://opencode.ai/config.json",
  "mcp": {
    "servers": {
      "draw-io": {
        "type": "remote",
        "url": "https://mcp.draw.io/mcp"
      }
    }
  }
}

Проверка: opencode mcp list показывает состояние каждого сервера, подключённый выглядит как ✓ context7 connected. Внутри OpenCode то же видно в /mcps.

Настройки → Разработчик → Изменить конфиг: файл claude_desktop_config.json. После правки перезапустите приложение. Подробно о Claude Desktop

Customize → Connectors → добавить свой коннектор.
Адрес сервера: https://mcp.draw.io/mcp

Проверка: Нажмите «Add files, connectors, and more /» в левом нижнем углу поля ввода, наведите на Connectors и откройте Manage connectors. Выберите сервер, чтобы увидеть его инструменты.

Вкладка Program → Install → Edit mcp.json. Подробно о LM Studio

{
  "mcpServers": {
    "draw-io": {
      "url": "https://mcp.draw.io/mcp"
    }
  }
}

Проверка: Попросите модель в чате выполнить задачу через инструмент сервера. Через API сервер из mcp.json вызывают по id в integrations, например mcp/playwright.

Инструменты сервера

create_diagramрисует диаграмму из XML или Mermaid

search_shapesищет фигуры и иконки

get_drawio_referenceотдаёт справку по формату

Локальный пакет npm от тех же авторов: открывает диаграмму в редакторе draw.io в браузере, понимает XML, CSV и Mermaid и правит отдельные страницы .drawio-файла.

Как подключить

Что сделать до подключения

Node.js с командой npx

DRAWIO_BASE_URL

необязательно: адрес своего сервера draw.io вместо https://app.diagrams.net/

DRAWIO_BROWSER

необязательно: off — только вернуть ссылку, без открытия браузера

Конфиг для вашего клиента

Команда в терминале, в папке проекта. Флаг --scope user подключит сервер для всех проектов. Подробно о Claude Code

claude mcp add --transport stdio drawio-mcp \
  -- npx -y @drawio/mcp

Файл ~/.codex/config.toml или .codex/config.toml в доверенном проекте. Можно и командой codex mcp add. Подробно о Codex

[mcp_servers.drawio-mcp]
command = "npx"
args = ["-y", "@drawio/mcp"]

Файл ~/.cursor/mcp.json для всех проектов или .cursor/mcp.json в папке проекта. Подробно о Cursor

{
  "mcpServers": {
    "drawio-mcp": {
      "command": "npx",
      "args": ["-y", "@drawio/mcp"]
    }
  }
}

Файл .mcp.json в корне проекта или ~/.copilot/mcp-config.json для всех проектов. Подробно о VS Code

{
  "mcpServers": {
    "drawio-mcp": {
      "type": "stdio",
      "command": "npx",
      "args": ["-y", "@drawio/mcp"]
    }
  }
}

Файл ~/.qwen/settings.json или .qwen/settings.json в проекте. Подробно о Qwen Code

{
  "mcpServers": {
    "drawio-mcp": {
      "command": "npx",
      "args": ["-y", "@drawio/mcp"]
    }
  }
}

Файл ~/.gemini/settings.json или .gemini/settings.json в проекте. Подробно о Gemini CLI

{
  "mcpServers": {
    "drawio-mcp": {
      "command": "npx",
      "args": ["-y", "@drawio/mcp"]
    }
  }
}

Файл opencode.json в папке проекта или ~/.config/opencode/opencode.json. Подробно о OpenCode

{
  "$schema": "https://opencode.ai/config.json",
  "mcp": {
    "servers": {
      "drawio-mcp": {
        "type": "local",
        "command": ["npx", "-y", "@drawio/mcp"]
      }
    }
  }
}

{
  "mcpServers": {
    "drawio-mcp": {
      "command": "npx",
      "args": ["-y", "@drawio/mcp"]
    }
  }
}

Вкладка Program → Install → Edit mcp.json. Подробно о LM Studio

{
  "mcpServers": {
    "drawio-mcp": {
      "command": "npx",
      "args": ["-y", "@drawio/mcp"]
    }
  }
}

Инструменты сервера

open_drawio_xmlоткрывает диаграмму из XML

open_drawio_csvстроит диаграмму из CSV

open_drawio_mermaidоткрывает диаграмму из Mermaid

search_shapesищет фигуры среди 10 000

get_drawio_referenceотдаёт справку по XML или Mermaid

list_pagesвыводит страницы .drawio-файла

get_pageчитает XML страницы

set_pageзаменяет содержимое страницы

Работает с живой диаграммой: свой редактор на localhost:3000 или расширение браузера, агент читает выделение и правит фигуры, связи, страницы и слои по одной.

Как подключить

Что сделать до подключения

Node.js 22 или новее

После перезапуска клиента открыть встроенный редактор http://localhost:3000/ или поставить расширение Draw.io MCP для Chrome или Firefox и открыть app.diagrams.net

Конфиг для вашего клиента

Команда в терминале, в папке проекта. Флаг --scope user подключит сервер для всех проектов. Подробно о Claude Code

claude mcp add --transport stdio drawio-mcp-server \
  -- npx -y drawio-mcp-server --editor

Файл ~/.codex/config.toml или .codex/config.toml в доверенном проекте. Можно и командой codex mcp add. Подробно о Codex

[mcp_servers.drawio-mcp-server]
command = "npx"
args = ["-y", "drawio-mcp-server", "--editor"]

Файл ~/.cursor/mcp.json для всех проектов или .cursor/mcp.json в папке проекта. Подробно о Cursor

{
  "mcpServers": {
    "drawio-mcp-server": {
      "command": "npx",
      "args": ["-y", "drawio-mcp-server", "--editor"]
    }
  }
}

Файл .mcp.json в корне проекта или ~/.copilot/mcp-config.json для всех проектов. Подробно о VS Code

{
  "mcpServers": {
    "drawio-mcp-server": {
      "type": "stdio",
      "command": "npx",
      "args": ["-y", "drawio-mcp-server", "--editor"]
    }
  }
}

Файл ~/.qwen/settings.json или .qwen/settings.json в проекте. Подробно о Qwen Code

{
  "mcpServers": {
    "drawio-mcp-server": {
      "command": "npx",
      "args": ["-y", "drawio-mcp-server", "--editor"]
    }
  }
}

Файл ~/.gemini/settings.json или .gemini/settings.json в проекте. Подробно о Gemini CLI

{
  "mcpServers": {
    "drawio-mcp-server": {
      "command": "npx",
      "args": ["-y", "drawio-mcp-server", "--editor"]
    }
  }
}

Файл opencode.json в папке проекта или ~/.config/opencode/opencode.json. Подробно о OpenCode

{
  "$schema": "https://opencode.ai/config.json",
  "mcp": {
    "servers": {
      "drawio-mcp-server": {
        "type": "local",
        "command": ["npx", "-y", "drawio-mcp-server", "--editor"]
      }
    }
  }
}

{
  "mcpServers": {
    "drawio-mcp-server": {
      "command": "npx",
      "args": ["-y", "drawio-mcp-server", "--editor"]
    }
  }
}

Вкладка Program → Install → Edit mcp.json. Подробно о LM Studio

{
  "mcpServers": {
    "drawio-mcp-server": {
      "command": "npx",
      "args": ["-y", "drawio-mcp-server", "--editor"]
    }
  }
}

Инструменты сервера

list-documentsвыводит подключённые диаграммы

get-selected-cellчитает выделенный элемент

get-shape-by-nameнаходит фигуру библиотеки

list-paged-modelвыводит элементы страницы

show-diagramпоказывает редактор в чате

add-rectangleдобавляет прямоугольник

add-cell-of-shapeдобавляет фигуру из библиотеки

add-edgeпроводит связь

edit-cellменяет текст, размер и стиль

edit-edgeменяет связь

delete-cell-by-idудаляет элемент

set-cell-shapeменяет вид фигуры

list-pagesвыводит страницы

create-pageсоздаёт страницу

list-layersвыводит слои

create-layerсоздаёт слой

move-cell-to-layerпереносит элемент на слой

export-diagramвыгружает XML, SVG или PNG

import-mermaidвставляет диаграмму Mermaid

save-documentсохраняет документ

Показано 20 из 31.

Форк lgazo без браузера: собирает XML draw.io в памяти, несёт 700 с лишним иконок Azure с нечётким поиском и пакетные операции; работает офлайн и в Docker.

Как подключить

Что сделать до подключения

Deno 2.3 или новее

Склонировать репозиторий: зависимости Deno подтянет при первом запуске

Конфиг для вашего клиента

Команда в терминале, в папке проекта. Флаг --scope user подключит сервер для всех проектов. Подробно о Claude Code

claude mcp add --transport stdio drawio-mcp-server \
  -- deno run --allow-net --allow-read --allow-env /path/to/drawio-mcp-server/src/index.ts

Файл ~/.codex/config.toml или .codex/config.toml в доверенном проекте. Можно и командой codex mcp add. Подробно о Codex

[mcp_servers.drawio-mcp-server]
command = "deno"
args = ["run", "--allow-net", "--allow-read", "--allow-env", "/path/to/drawio-mcp-server/src/index.ts"]

Файл ~/.cursor/mcp.json для всех проектов или .cursor/mcp.json в папке проекта. Подробно о Cursor

{
  "mcpServers": {
    "drawio-mcp-server": {
      "command": "deno",
      "args": [
        "run",
        "--allow-net",
        "--allow-read",
        "--allow-env",
        "/path/to/drawio-mcp-server/src/index.ts"
      ]
    }
  }
}

Файл .mcp.json в корне проекта или ~/.copilot/mcp-config.json для всех проектов. Подробно о VS Code

{
  "mcpServers": {
    "drawio-mcp-server": {
      "type": "stdio",
      "command": "deno",
      "args": [
        "run",
        "--allow-net",
        "--allow-read",
        "--allow-env",
        "/path/to/drawio-mcp-server/src/index.ts"
      ]
    }
  }
}

Файл ~/.qwen/settings.json или .qwen/settings.json в проекте. Подробно о Qwen Code

{
  "mcpServers": {
    "drawio-mcp-server": {
      "command": "deno",
      "args": [
        "run",
        "--allow-net",
        "--allow-read",
        "--allow-env",
        "/path/to/drawio-mcp-server/src/index.ts"
      ]
    }
  }
}

Файл ~/.gemini/settings.json или .gemini/settings.json в проекте. Подробно о Gemini CLI

{
  "mcpServers": {
    "drawio-mcp-server": {
      "command": "deno",
      "args": [
        "run",
        "--allow-net",
        "--allow-read",
        "--allow-env",
        "/path/to/drawio-mcp-server/src/index.ts"
      ]
    }
  }
}

Файл opencode.json в папке проекта или ~/.config/opencode/opencode.json. Подробно о OpenCode

{
  "$schema": "https://opencode.ai/config.json",
  "mcp": {
    "servers": {
      "drawio-mcp-server": {
        "type": "local",
        "command": [
          "deno",
          "run",
          "--allow-net",
          "--allow-read",
          "--allow-env",
          "/path/to/drawio-mcp-server/src/index.ts"
        ]
      }
    }
  }
}

{
  "mcpServers": {
    "drawio-mcp-server": {
      "command": "deno",
      "args": [
        "run",
        "--allow-net",
        "--allow-read",
        "--allow-env",
        "/path/to/drawio-mcp-server/src/index.ts"
      ]
    }
  }
}

Вкладка Program → Install → Edit mcp.json. Подробно о LM Studio

{
  "mcpServers": {
    "drawio-mcp-server": {
      "command": "deno",
      "args": [
        "run",
        "--allow-net",
        "--allow-read",
        "--allow-env",
        "/path/to/drawio-mcp-server/src/index.ts"
      ]
    }
  }
}

Инструменты сервера

search-shapesищет фигуры и иконки Azure

get-style-presetsотдаёт готовые стили

add-cellsдобавляет фигуры и связи пачкой

edit-cellsменяет фигуры пачкой

edit-edgesменяет связи

create-groupsсоздаёт группы и контейнеры

add-cells-to-groupкладёт элементы в группу

create-layerсоздаёт слой

create-pageсоздаёт страницу

get-diagram-statsсчитает элементы и границы

export-diagramвыгружает XML draw.io

import-diagramзагружает XML draw.io

Что попросить агента

«Нарисуй через open_drawio_mermaid диаграмму последовательности входа по OAuth2»@drawio/mcp вызовет open_drawio_mermaid и откроет диаграмму в редакторе

«Построй через open_drawio_csv оргструктуру: CEO → CTO, CFO; CTO → 3 инженера»@drawio/mcp вызовет open_drawio_csv

«Нарисуй архитектуру AWS с VPC, подсетями и группами безопасности»Агент найдёт иконки через search_shapes и соберёт схему через create_diagram или open_drawio_xml

«Добавь слой Background, перенеси на него декоративные элементы и создай слой для подписей»Сервер lgazo вызовет create-layer и move-cell-to-layer

«Нарисуй CRUD API: база данных, API-шлюз и четыре микросервиса с эндпоинтами»Сервер lgazo добавит фигуры через add-cell-of-shape и связи через add-edge

Для каких задач

Нарисовать блок-схему, схему процесса или архитектуры со слов

Превратить код Mermaid или таблицу CSV в редактируемую диаграмму draw.io

Найти иконки AWS, Azure, GCP, Cisco и Kubernetes среди 10 000 фигур

Поправить диаграмму в открытом редакторе: фигуры, связи, слои и страницы

Отредактировать одну страницу многостраничного .drawio-файла

Собрать схему облака Azure без браузера и выгрузить XML

Ограничения

Удалённый сервер mcp.draw.io получает диаграмму вместе с запросом; чтобы она не покидала машину, берите @drawio/mcp или разверните App Server у себя

Прямо в чате диаграмма видна только в клиентах с MCP Apps, остальные получают ссылку на draw.io

Инструменты страниц @drawio/mcp работают только с локальными файлами: Google Drive, OneDrive, Dropbox, GitHub и GitLab сервер не читает

Сервер simonkurtz без состояния между вызовами: каждый раз передаётся весь diagram_xml; у проекта 82 звезды и последнее обновление в мае 2026 года

Если не работает

Error: Port 3333 is already in use

Порт расширения занят: остановите процесс на 3333 или добавьте в args сервера lgazo флаг --extension-port с другим портом, например 8888.

Клиент получает ECONNREFUSED или 404 на /mcp у сервера lgazo

HTTP-транспорт включается отдельно: запустите сервер с --transport http или --transport stdio,http. Если /health отвечает {"status":"mcp not ready"}, подождите или перезапустите.

Claude Desktop рисует схему своими средствами вместо draw.io

Назовите инструмент в запросе или добавьте инструкцию: «Always use the draw.io MCP tools to create diagrams».

Браузер открывается не на той машине: агент в SSH или CI

Задайте для @drawio/mcp переменную DRAWIO_BROWSER=off: сервер вернёт только ссылку на диаграмму.

Какую реализацию выбрать

Реализация	Кто делает	Звёзды	Запуск	Ключ	Инструменты	Обновлён
draw.io MCP App Serverразработчик сервиса	JGraph (draw.io)	5,8 тыс.	HTTP	не нужен	3	11 ноября 2026
draw.io MCP Tool Server (@drawio/mcp)разработчик сервиса	JGraph (draw.io)	5,8 тыс.	локально	не нужен	8	11 ноября 2026
Draw.io MCP server	Ladislav Gazo (lgazo)	1,5 тыс.	локально	не нужен	31	1 ноября 2026
Draw.io MCP Server (simonkurtz)	Simon Kurtz	82	локально	не нужен	12	15 мая 2026

Частые вопросы

Какой вариант draw.io MCP выбрать?

Чтобы видеть схему прямо в чате Claude.ai, ChatGPT или Cursor, подключите mcp.draw.io. Для работы на своём компьютере с открытием в редакторе возьмите @drawio/mcp. Править уже открытую диаграмму по элементам умеет сервер lgazo, собирать XML без браузера — сервер simonkurtz.

Уходит ли диаграмма на чужие серверы?

У mcp.draw.io диаграмма отправляется на сервер draw.io. У @drawio/mcp она передаётся в части адреса после #, которую браузер не отправляет на сервер. Плагины для ассистентов пишут файл локально.

Как получить PNG, SVG или PDF?

Это умеют плагины draw.io для Claude Code, Codex и Copilot: они пишут .drawio и экспортируют через локальный draw.io Desktop со встроенным XML, так файл остаётся редактируемым. Сервер lgazo выгружает SVG и PNG через export-diagram.

Можно ли открыть диаграмму в своём draw.io?

Да, у @drawio/mcp задайте переменную DRAWIO_BASE_URL с адресом своего сервера draw.io. Для App Server, развёрнутого у себя, та же переменная меняет ссылку «Open in draw.io».

Как поправить схему, которая лежит в Google Drive?

В draw.io откройте Extras → Edit Diagram, скопируйте XML страницы агенту и попросите вернуть изменённый XML. Затем вставьте его туда же и нажмите Apply: файл сохранится по той же ссылке.

Как подключить drawio MCP к Claude Code?

Выполните claude mcp add drawio -- npx -y @drawio/mcp. Другой путь — плагин: /plugin marketplace add jgraph/drawio-mcp, затем /plugin install drawio@drawio, он пишет .drawio-файлы и умеет экспорт.

Как подключить draw.io MCP к Codex?

Плагин ставится командами codex plugin marketplace add jgraph/drawio-mcp и codex plugin add drawio@drawio. Для сервера lgazo есть npx drawio-mcp-server install codex, он сам пропишет конфиг.

Есть ли у draw.io свой MCP-сервер?

Да, его ведёт JGraph в репозитории jgraph/drawio-mcp: удалённый https://mcp.draw.io/mcp и пакет npm @drawio/mcp. Серверы lgazo и simonkurtz — сторонние проекты.

Работает ли сервер из России?

@drawio/mcp и оба сторонних сервера работают на вашем компьютере; удалённый mcp.draw.io подключается по адресу без ключей.

draw.io MCP: схемы и диаграммы агентом в Claude, Codex и Cursor

Как подключить

Что сделать до подключения

Конфиг для вашего клиента

Инструменты сервера

Как подключить

Что сделать до подключения

Конфиг для вашего клиента

Инструменты сервера

Как подключить

Что сделать до подключения

Конфиг для вашего клиента

Инструменты сервера

Как подключить

Что сделать до подключения

Конфиг для вашего клиента

Инструменты сервера

Что попросить агента

Для каких задач

Ограничения

Если не работает

Какую реализацию выбрать

Частые вопросы

Похожие серверы