Canicode MCP Server

Analyze Figma designs for dev & AI readiness. 39 rules, scoring, HTML reports.

Remote serverstreamable-http

What is the Canicode MCP server?

Analyze Figma designs for dev & AI readiness. 39 rules, scoring, HTML reports. That is what the canicode mcp server brings to an AI assistant: the same capability, reachable through the Model Context Protocol rather than a separate app or dashboard.

The short version

Ship your Figma design exactly as you intended — without learning CSS.

Getting it running

Because this one is hosted, setup is mostly authentication — you point your client at the endpoint and approve access. Nothing runs on your machine, so there is no runtime to keep patched.

The tools it exposes

The server publishes 11 tools. What each one is for:

  • canicode — lightweight CLI wrapper (use /canicode )
  • canicode-gotchas — standalone gotcha survey (use /canicode-gotchas )
  • canicode-roundtrip — full analyze → gotcha → apply roundtrip (use /canicode-roundtrip )
  • uses — let-sunny/canicode-action@v0.1.0
  • Privacy — ** See PRIVACY.md for details on data collection and how to opt out
  • Category — Rules
  • Interaction — 2
  • Semantic — 3
  • Seat — File in Starter plan
  • What — How
  • Presets — --preset relaxed \

What it needs from you

Configuration is passed through the environment: FIGMA_TOKEN. Treat anything key-shaped as a real credential — scope it to the minimum the server needs, and rotate it if it ever lands in a shared config.

Things to watch

  • Your data travels to the provider's service, so the usual questions apply about what you send and what they retain.
  • With 11 tools registered it takes up a noticeable share of the context window; turn it off in projects that never touch Canicode.
  • Missing credentials fail quietly in some clients — if no tools show up, check the environment block first.
  • Keep per-call confirmation enabled while you learn its behaviour; it is the cheapest safeguard you have.

How it compares

This sits in the developer tooling group, where several servers overlap in what they claim to do but differ sharply once you actually set them up. Canicode's toolset — canicode, canicode-gotchas, canicode-roundtrip and 8 more — is a fair guide to whether it matches your workflow. It is maintained by let-sunny; worth a glance at recent repository activity before you build anything load-bearing on it.

We check each listing at SyncDev against the project's documentation before it goes live — if something here drifts out of date, it is a bug worth reporting.

Available tools

ToolWhat it does
canicodelightweight CLI wrapper (use /canicode <figma-url>)
canicode-gotchasstandalone gotcha survey (use /canicode-gotchas <figma-url>)
canicode-roundtripfull analyze → gotcha → apply roundtrip (use /canicode-roundtrip <figma-url>)
useslet-sunny/canicode-action@v0.1.0
Privacy** See [PRIVACY.md](PRIVACY.md) for details on data collection and how to opt out
CategoryRules
Interaction2
Semantic3
SeatFile in Starter plan
WhatHow
Presets--preset relaxed \

How to install the Canicode MCP server

{
  "mcpServers": {
    "canicode": {
      "command": "npx",
      "args": ["-y", "canicode"],
      "env": {
        "FIGMA_TOKEN": "your-value"
      }
    }
  }
}

Add to claude_desktop_config.json, then restart Claude Desktop.

Configuration

VariableDescriptionRequired
FIGMA_TOKENCredential the server authenticates with.Yes

Example prompts to try

  • Use Canicode to canicode.
  • Use Canicode to canicode-gotchas.
  • Use Canicode to canicode-roundtrip.

Frequently asked questions

It connects Canicode to MCP-compatible AI assistants such as Claude and Cursor, exposing 11 tools (canicode, canicode-gotchas, canicode-roundtrip, and more) that the assistant can call on your behalf. Instead of copying data back and forth by hand, the assistant works with Canicode directly.