Canva Dev MCP Server

Что умеет сервер

Canva Dev MCP Server запускается командой @canva/cli и даёт ИИ-клиенту специализированные инструменты и документацию для разработки приложений Canva. В документации Canva сказано, что Canva Apps SDK, Connect APIs и MCP теперь объединены в Canva Developers SDK. Сервер помогает находить нужные разделы этого SDK и отвечать на вопросы по его устройству. Пример проверочного запроса из руководства: «How many components are in the App UI Kit?».

Инструменты вызываются самой моделью, напрямую их запустить нельзя. Чтобы модель обратилась к серверу, в запросе используют ключевые слова вроде App UI Kit и Canva Developers SDK или просят дать ссылки на документацию Canva.

Когда использовать

Подключайте сервер, когда вы пишете приложение для Canva и хотите, чтобы агент в Cursor, Claude Code, VS Code или Claude Desktop отвечал по актуальной документации SDK, а не по памяти. Для рабочей разработки Canva рекомендует Cursor или Claude Code из-за более удобной обратной связи. Claude Desktop, по её словам, хорошо подходит для помощи с документацией.

Сервер не предназначен для работы с готовыми дизайнами: создавать, редактировать и экспортировать макеты он не умеет. Для этого у Canva есть отдельный Canva AI Connector, и страница руководства направляет к нему в Центре поддержки. Эта запись про него не рассказывает.

Ограничения и безопасность

Нужны git, Node.js v24 или новее и npm. Инструменты работают в режиме агента, в части клиентов, например в Cursor и VS Code, обычные чаты их не используют. Если клиент не видит инструментов, проверьте конфигурацию и перезапустите приложение; если ответы неточны, начните новый чат и уточните запрос.

Сервер работает локально на вашем компьютере и загружает документацию с canva.dev и из других источников. Canva заявляет, что сервер не передаёт ваш код и запросы никуда, кроме вашего ИИ-агента или LLM-инструмента. Параметр @latest в конфигурации при каждом запуске берёт свежую версию пакета, учитывайте это, если нужна фиксация версии.

Требования

Нужны git, Node.js v24 или новее, npm и совместимый MCP-клиент, например Cursor или Claude Desktop.

Claude Code

Выполните в терминале:

claude mcp add canva-dev -- npx -y @canva/cli@latest mcp

Cursor

В каталоге проекта создайте файл конфигурации:

mkdir -p .cursor
touch .cursor/mcp.json

Добавьте в .cursor/mcp.json:

{
  "mcpServers": {
    "canva-dev": {
      "command": "npx",
      "args": [
        "-y",
        "@canva/cli@latest",
        "mcp"
      ]
    }
  }
}

Claude Desktop

Откройте Settings (Ctrl + , в Windows, Command + , в macOS), вкладку Developer, нажмите Edit Config и добавьте:

{
  "mcpServers": {
    "canva-dev": {
      "command": "npx",
      "args": [
        "-y",
        "@canva/cli@latest",
        "mcp"
      ]
    }
  }
}

VS Code

mkdir -p .vscode
touch .vscode/mcp.json

Добавьте в .vscode/mcp.json:

{
  "servers": {
    "canva-dev": {
      "type": "stdio",
      "command": "npx",
      "args": [
        "-y",
        "@canva/cli@latest",
        "mcp"
      ]
    }
  }
}

После изменения конфигурации сохраните файл и перезапустите клиент.