Skip to content
Canva Dev MCP Server

Canva Dev MCP Server

by Canva
Added to Onei
Docs npm
Developer Tools

Summary

Canva's official MCP server for building Canva apps — grounds an agent in the Apps SDK and App UI Kit docs instead of letting it guess the API.

Features

  • Grounds code generation in the current Canva Apps SDK documentation
  • Covers the App UI Kit component system so generated UI matches the editor
  • Runs locally over stdio via the Canva CLI — nothing to host
  • No API key or authentication step for the documentation surface
  • Works with Cursor, VS Code Agent mode, Claude Desktop and Claude Code
  • Companion llms.txt index published for direct documentation access

Installation

Set up this MCP server in your favorite AI agent — copy a ready-made configuration below.

Any MCP-compatible agent

Most agents (Claude, Cursor, Windsurf, VS Code, and more) read a standard mcpServers configuration.

  1. Open your agent's MCP configuration file.
  2. Merge the snippet below into it.
  3. Restart the agent — the "Canva Dev MCP Server" tools will be available.
{
  "mcpServers": {
    "canva-dev": {
      "command": "npx",
      "args": [
        "-y",
        "@canva/cli@latest",
        "mcp"
      ]
    }
  }
}

Description

The Canva Dev MCP server connects an AI coding assistant to canva.dev, the developer platform behind Canva apps and integrations. Its job is narrow and useful: when an agent is writing code against the Canva Apps SDK or laying out UI with the App UI Kit, this server puts the current documentation in front of it rather than letting it improvise from whatever it remembers.

That matters more for Canva than for most platforms, because the App UI Kit is a constrained component system — apps are expected to look native inside the Canva editor — and an agent that invents plausible props or reaches for arbitrary CSS produces something that will not pass review. Grounding the generation in the real component contracts is the difference between a scaffold you can ship and one you rewrite.

How it runs. A single command, npx -y @canva/cli@latest mcp, launched over stdio from your editor's MCP configuration. It executes locally on your machine and only fetches documentation from canva.dev — no code or prompt content is sent anywhere beyond the AI client you have already chosen. There is no separate authentication step and no plan requirement documented for the docs surface.

Supported clients. Cursor in Agent mode via .cursor/mcp.json, VS Code in Agent mode via .vscode/mcp.json, Claude Desktop through its settings file, and Claude Code. Tools are model-invoked, so they activate from the conversation rather than being called explicitly.

Canva also publishes a complete documentation index at https://www.canva.dev/docs/apps/llms.txt if you would rather feed the docs to an agent directly.

Related MCP Servers

MCP: Brandfetch MCP

by Brandfetch

Official remote MCP server from Brandfetch that gives an agent real company logos, brand colours, fonts and merchant identification instead of guessed or hallucinated assets.

Developer Tools

MCP: Webflow MCP Server

by Webflow

Webflow's official MCP server — let agents read and edit sites, pages, CMS collections and items through the Webflow Data API, with a companion app that syncs the live Designer canvas.

Developer ToolsProductivity

MCP: Postman MCP Server

by Postman

Featured

Postman's official MCP server — reach your workspaces, collections, specs and environments from Claude Code, Cursor, VS Code or Copilot, in four tool tiers.

Developer Tools
68 views
Browse all MCP servers →