Skip to main content
Glama
elisbanpaco

Canva MCP Server

by elisbanpaco

🎨 Canva MCP Server

CI License: MIT Node.js Version NPM Version MCP Standard TypeScript Tested with Vitest

将你的 AI 助手(Google Antigravity、Gemini CLI、Claude Desktop、Cursor)直接连接到你的 Canva 账户,通过官方 API(Canva Connect API)。使用自然语言创建、搜索、导出和上传设计。


⚡ 快速入门(Quickstart)

1. 通过 npx 直接配置

你可以直接使用 npx 运行它,无需克隆仓库:

🤖 Google Antigravity / Gemini CLI (~/.gemini/config/mcp_config.json)

{
  "mcpServers": {
    "canva": {
      "command": "npx",
      "args": ["-y", "@elisbanpaco/mcp-canva-gemini-cli"],
      "env": {
        "CANVA_CLIENT_ID": "tu_client_id",
        "CANVA_CLIENT_SECRET": "tu_client_secret"
      }
    }
  }
}

🟣 Claude Desktop (claude_desktop_config.json)

{
  "mcpServers": {
    "canva": {
      "command": "npx",
      "args": ["-y", "@elisbanpaco/mcp-canva-gemini-cli"],
      "env": {
        "CANVA_CLIENT_ID": "tu_client_id",
        "CANVA_CLIENT_SECRET": "tu_client_secret"
      }
    }
  }
}

💻 Cursor IDE (.cursor/mcp.json)

{
  "mcpServers": {
    "canva": {
      "command": "npx",
      "args": ["-y", "@elisbanpaco/mcp-canva-gemini-cli"],
      "env": {
        "CANVA_CLIENT_ID": "tu_client_id",
        "CANVA_CLIENT_SECRET": "tu_client_secret"
      }
    }
  }
}

Related MCP server: Canvelete

🧰 可用工具

连接后,你可以让你的 AI 执行以下操作:

工具

功能

提示示例

canva_list_designs

列出你最近的设计,包含缩略图和编辑链接。

"显示我在 Canva 中最近的演示文稿"

canva_get_design

通过 ID 获取设计的详细信息、页面和 URL。

"给我 ID 为 DAHKDKZXFcQ 的设计信息"

canva_create_design

创建新设计(演示文稿、文档、Instagram 帖子等)。

"在 Canva 中创建一个标题为“2026 发布”的 Instagram 帖子"

canva_export_design

将设计导出为 PNG、JPG、PDF 或 PPTX,并提供下载链接。

"将我的演示文稿导出为 PDF 格式"

canva_list_folders

浏览你的 Canva 根文件夹的内容。

"我的 Canva 主文件夹中有哪些元素?"

canva_list_folder_items

列出特定文件夹中的元素。

"显示 ID 为 X 的文件夹中的文件"

canva_create_folder

在你的 Canva 中创建新文件夹。

"创建一个名为“2026 项目”的文件夹"

canva_upload_asset

将你计算机上的本地图片上传到 Canva。

"将图片 ./banner.png 上传到我的 Canva 账户"

canva_get_auth_status

检查连接状态和令牌的有效性。

"检查我与 Canva 的连接是否处于活动状态"


🔑 凭据初始配置

  1. 进入 Canva Developers 并点击 Your integrations

  2. 点击 Create an integration $\rightarrow$ 选择 Public

    创建 Canva 集成

  3. Credentials 中,复制你的 Client ID 并生成你的 Client Secret

  4. Scopes 中,启用以下权限(这些是唯一兼容的权限):

    • design:content:read, design:content:write, design:meta:read

    • asset:read, asset:write, folder:read, folder:write, app:read

    在 Canva 中配置 Scopes

  5. Authentication 中,添加确切的重定向 URL: http://127.0.0.1:3000/callback

    添加重定向 URL

身份验证(仅第一次)

由于 Canva 要求每个用户提供凭据,请打开终端并执行以下命令进行身份验证并安全地保存令牌:

# En Linux/macOS
export CANVA_CLIENT_ID="tu_client_id"
export CANVA_CLIENT_SECRET="tu_client_secret"
npx -p @elisbanpaco/mcp-canva-gemini-cli mcp-canva-auth

# En Windows (PowerShell)
$env:CANVA_CLIENT_ID="tu_client_id"
$env:CANVA_CLIENT_SECRET="tu_client_secret"
npx -p @elisbanpaco/mcp-canva-gemini-cli mcp-canva-auth

将打开你的浏览器进行确认。完成!你的令牌将以 0600 权限保存在你的操作系统上。


🏗️ 架构与安全

sequenceDiagram
    autonumber
    actor User as Usuario / Asistente IA
    participant MCP as Canva MCP Server (Stdio)
    participant Vault as Bóveda de Tokens (~/.config/canva-mcp)
    participant CanvaOAuth as Canva OAuth2 (PKCE S256)
    participant CanvaAPI as Canva Connect API (REST v1)

    Note over User,CanvaAPI: 1. Flujo de Autenticación (pnpm auth)
    MCP->>CanvaOAuth: Inicia flujo PKCE con desafío SHA-256
    CanvaOAuth-->>MCP: Redirección con Código de Autorización
    MCP->>CanvaOAuth: Intercambio de código por Tokens de acceso
    CanvaOAuth-->>MCP: Access Token + Refresh Token
    MCP->>Vault: Guarda en almacenamiento seguro (Permisos 0600)

    Note over User,CanvaAPI: 2. Ejecución de Herramientas en Tiempo Real
    User->>MCP: Llama a herramienta (ej. canva_list_designs)
    MCP->>Vault: Carga token válido (Auto-renovación con Mutex)
    MCP->>CanvaAPI: Petición HTTP Bearer con Exponential Backoff
    CanvaAPI-->>MCP: Respuesta JSON con metadatos y URLs
    MCP-->>User: Resultado estructurado

工程特性:

  • 🔐 安全 OS 保险库:令牌保存在系统目录中(Linux/Mac 上的 ~/.config/canva-mcp/ 或 Windows 上的 %APPDATA%\canva-mcp),具有 POSIX 0600 权限(仅你的用户可读)。

  • 防碰撞互斥锁:在令牌续期期间,当模型并行执行多个工具时,防止竞态条件。

  • 🛡️ 指数退避:在遇到速率限制(HTTP 429)和临时故障(5xx)时,自动重试并采用指数退避。

  • 🧪 100% 测试覆盖率:使用 Vitest 的完整单元测试套件。


🧪 测试与开发

# Ejecutar suite de pruebas unitarias
pnpm test

# Verificación estricta de tipos TypeScript
pnpm typecheck

# Compilar paquete de producción
pnpm build

📄 许可证

本项目采用 MIT 许可证。有关更多详细信息,请参阅 LICENSE 文件。

A
license - permissive license
A
quality
A
maintenance

Maintenance

Maintainers
Response time
0dRelease cycle
2Releases (12mo)
Commit activity

Resources

Unclaimed servers have limited discoverability.

Looking for Admin?

If you are the server author, to access and configure the admin panel.

Related MCP Servers

View all related MCP servers

Related MCP Connectors

  • Sync Lightroom, Figma, Dropbox & Canva assets to WordPress and Shopify via natural language.

  • Sync Lightroom, Figma, Dropbox & Canva assets to WordPress and Shopify via natural language.

  • Connect AI assistants to Stellary projects, boards, documents, and governed agent workflows.

View all MCP Connectors

Latest Blog Posts

MCP directory API

We provide all the information about MCP servers via our MCP API.

curl -X GET 'https://glama.ai/api/mcp/v1/servers/elisbanpaco/mcp-canva-gemini-cli'

If you have feedback or need assistance with the MCP directory API, please join our Discord server