Skip to main content
Glama
deenesjakoruzh
elisbanpaco

Canva MCP Server

by elisbanpaco
OverviewSchemaRelated ServersScoreDiscussions
TypeScript
Local

🎨 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)를 공식 API(Canva Connect API)를 통해 Canva 계정에 직접 연결하세요. 자연어로 디자인을 만들고, 검색하고, 내보내고, 업로드할 수 있습니다.

⚡ 빠른 시작 (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 자격 증명 보관소: 토큰은 시스템 디렉터리(~/.config/canva-mcp/ Linux/Mac 또는 %APPDATA%\canva-mcp Windows)에 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 파일을 참조하세요.

Install Server
RayrunBuild, deploy, and operate MCP servers without becoming an infrastructure team.ray.runAd
A
license - permissive license
A
quality
A
maintenance

How are these scores calculated?

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.

Tools

View all tools

Related MCP Servers

View all related MCP servers

Related MCP Connectors

  • lsp

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

  • lsp

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

  • Stellary Project Management MCP Server

    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