How do I install the Canva Dev MCP?

Run `claude mcp add canva-dev -- npx -y @canva/cli@latest mcp` in your terminal. For Claude Desktop, Cursor, or VS Code, add an equivalent `mcpServers` entry running the same command.

How does the Canva Dev MCP access documentation?

The server runs locally on your device and fetches documentation from canva.dev on demand, without transmitting your code or prompts externally. Tools are LLM-controlled and invoked through relevant keywords — mentioning "App UI Kit" pulls UI component documentation, and "Apps SDK" pulls SDK API reference.

MCP Connector

Accelerate Canva App Development with AI Docs

Name: Canva Dev MCP
Availability: OnlineOnly
Author: VibeBaza

Get AI-powered help building Canva apps with direct access to App UI Kit component docs and the Canva Apps SDK reference.

Connect

Works with canva

VibeBaza

Own this? Claim it

Spark score

out of 100

Updated 7 months ago

Fresher alternatives ↓

Version 1.0.0

Models

universal

Add to Favorites

Why it matters

Streamline your Canva app development process by leveraging AI-powered assistance. This connector provides instant access to App UI Kit documentation and SDK references, enabling faster and more efficient coding.

Outcomes

What it gets done

Access comprehensive App UI Kit documentation.

Retrieve complete Canva Apps SDK API references.

Get AI-powered development assistance for building Canva apps.

Fetch documentation locally from canva.dev for privacy.

Install

Add it to your toolbox

Run in your project directory:

curl -fsSL https://spark.entire.vc/get/vb-canva | bash

Overview

Canva Dev MCP

A local MCP server giving AI assistants grounded access to Canva's App UI Kit documentation and Apps SDK reference for building Canva apps. Reach for this when developing a Canva app or integration and needing AI assistance grounded in the official App UI Kit and Apps SDK docs, not for designing Canva documents.

What it does

The Canva Dev MCP Server provides AI-powered development assistance for building Canva apps and integrations, with direct access to App UI Kit documentation and Canva Apps SDK references. It runs locally and fetches documentation from canva.dev on demand, giving the assistant grounded answers about UI components, SDK APIs, and available app scopes.

Tools are LLM-controlled and invoked through relevant keywords - mentioning "App UI Kit" pulls UI component documentation, and "Apps SDK" pulls SDK API reference.

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

When to use - and when NOT to

Use this when building a Canva app or integration and you want an AI assistant to answer questions like "how many components are in the App UI Kit?", "how do I create a button in a Canva app?", or "what scopes are available for Canva apps?" grounded in the actual Canva developer documentation.

Do NOT use this for designing or editing Canva documents themselves - this is a developer documentation assistant for building Canva apps, not a design-automation tool for Canva's design canvas.

Capabilities

App UI Kit documentation: access to all UI component documentation
Apps SDK reference: complete SDK API reference
AI-powered development assistance for Canva app building
Local processing: runs on your device, fetching docs from canva.dev without transmitting your code or prompts externally

How to install

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

For Claude Desktop, Cursor, or VS Code, add an equivalent mcpServers entry running npx -y @canva/cli@latest mcp.

Who it's for

Developers building Canva apps or integrations who want AI assistance grounded in the official App UI Kit and Apps SDK documentation.

Source README

The Canva Dev MCP Server provides AI-powered development assistance for building Canva apps and integrations, with direct access to App UI Kit documentation and SDK references.

Installation

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

Configuration

Claude Code

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

Claude Desktop

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

Cursor

Create .cursor/mcp.json:

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

VS Code

Create .vscode/mcp.json:

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

Features

App UI Kit Documentation - Access to all UI component documentation
Apps SDK Reference - Complete SDK API reference
Development Assistance - AI-powered help for Canva app development
Local Processing - Server runs locally, fetches docs from canva.dev

Usage Notes

MCP tools are LLM-controlled and invoked through relevant keywords:

"App UI Kit" - For UI component documentation
"Apps SDK" - For SDK API reference
Canva documentation references

Usage Examples

How many components are in the App UI Kit?

How do I create a button in a Canva app?

What scopes are available for Canva apps?

Security and Privacy

Server operates locally on your device
Fetches Canva documentation from canva.dev
Does not transmit your code or prompts to external sources

Resources

FAQ

Common questions

Discussion