MCP.Market

Canicode MCP server

by let-sunny·io.github.let-sunny/canicode·v0.5.2·10 stars
No reviews yet

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

C60/100grade C
Write a reviewInstall
What users say
No reviews yet
Be the first
Safety scan
C60/100

full report

Adoption
New

10 stars

Reviews

Write one

Nobody has reviewed Canicode yet.

If you have run it, two minutes of your experience saves the next person an afternoon.

Canicode tools (3)

write = sends, deletes, buys or posts

Read from the package source without running it. The installed server may list more.

  • analyze

    Analyze a Figma design for development-friendliness and AI-friendliness. Two ways to provide design data: 1. designData \u2014 Pass Figma node data directly (from Figma MCP get_metadata). Recommended when using Figma MCP. 2. input \u2014 Figma URL (fetches via REST API, requires FIGMA_TOKEN). Typical flow with Figma MCP: Step 1: Call Figma MCP get_metadata to get the node tree Step 2: Pass the res

  • docs

    Get the customization guide for CanICode. Returns documentation on: - Config overrides (excludeNodeNames, excludeNodeTypes, gridBase, colorTolerance, per-rule score/severity/enabled) - Custom rules (how to add project-specific checks) - All 39 rule IDs with default scores and severity - Example configs (strict, relaxed, mobile-first) Use this when the user asks about customization, configuration,

  • list-rules

    List all available analysis rules with their current configuration

Public scan report

scanner v0.1.10 · 2026-09-27 · same rubric, same numbers if you re-run it

1 high
  • Code scan7 source files scanned13/25
  • –Live reliabilityno gateway calls yet and no remote to proben/a
  • –Tool poisoningtools not inspected (local package is not executed); not countedn/a
  • Auth qualitystatic API keys via environment variables6/15
  • Maintenancelast push 85 days ago12/15
  • Maintainer identityregistry namespace matches repository owner; GitHub account older than a year8/10

Findings (1)

  • highShell command built from a string (injection risk)exec.shell-concat
    dist/cli/index.js: …port('child_process'); const result = execSync( `claude --print "Use the mcp__figma__get_metadata tool with fileKey=\\"${fileKey}\\" and nodeId=\\"${nodeId.replace(/-/g, ":")}\\" \u2014 ret…
Overall 60/100. Components that don't apply are left out of the denominator. Any critical finding is an F.RubricAppeal a findingJSON

How Canicode compares

Against every graded Media MCP server, from our own scans and uptime checks. Updated after each scan run.

Safety score
60/100
higher than 14% of 1,337 Media servers
Tools
3
the typical Media server has 7
Tools that change things
0%
typical: 4%. Fewer write tools means less an agent can break
GitHub stars
10
more than 87% of 715 Media servers

What its tools let an agent do: 3 read

Install Canicode in Claude Code, Cursor or VS Code

Runs npx -y canicode on your machine. Read the scan report first; the gateway never runs local packages.

claude mcp add canicode -- npx -y canicode
Add to Cursor

What the publisher says

From the Canicode repository's README, as published. We do not edit it. Read it on GitHub

CanICode

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

Try it in your browser — no install needed.

What canicode does

You designed it in Figma. You know exactly how it should look and behave — but the AI codegen guesses, and half the time it guesses wrong. The cards don't stack on mobile. The hover state disappears. The padding gets normalised. That's not what I designed.

canicode is the pre-implementation interview between your Figma file and AI codegen. It asks the questions a developer would ask before they implement — in plain language you can answer:

"The three cards are side-by-side at desktop width — what should happen when the screen is narrow?"

You answer in plain words ("좁아지면 한 줄에 하나씩" / "stack them vertically"). canicode translates that into the exact technical spec the codegen needs, and writes it back into your Figma file as a structured annotation so the next run no longer has to guess.

You stay in Figma. You never type a CSS selector. The intent ships.

→ Full thesis: docs/POSITIONING.md

The three layers

  1. Linter — 17 rules surface the gaps your craft instinct senses but can't name. "Something's off with this spacing." → it finds the one card with 14px padding while the rest are 16px.
  2. Q&A scaffolding — for every gap, canicode asks in your vocabulary, not the developer's. You answer, it spec'ifies.
  3. Roundtrip persistence — answers live in the Figma file as Dev Mode annotations. Next run, next person, next codegen — they all see the intent.

The linter is deterministic (no LLM tokens consumed for the analysis itself), ablation-validated at 94% pixel accuracy with 5× fewer tokens than raw JSON, and calibrated against real Figma designs.

Why canicode (vs Claude Design)

Claude Design launched in April 2026 and covers the prompt → app path beautifully — AI designs from your prompt and hands the result to Claude Code. canicode covers a different workflow:

If you want the AI to design for you, use Claude Design. If you already designed it and want it implemented exactly the way you intended, canicode is for you. The two are not in competition — they assume different things about who owns the design.

See docs/POSITIONING.md for the full thesis (target persona, the workflow assumption, and what canicode is not for).

The Roundtrip Workflow

Shortened. The full README is on GitHub.

Nothing above is checked by us. What we check is on the safety report.

Canicode: common questions

Is Canicode MCP server safe?
With care: it is graded C, so read the findings first (60/100). Read the Canicode safety report
How do I install Canicode?
It runs on your machine. Copy the Claude Code, Cursor, VS Code or Claude Desktop config from the install section.
Does Canicode need an API key?
Yes. The registry entry asks for FIGMA_TOKEN.
Is Canicode maintained?
The last commit was 122 days ago (2026-07-05). The latest release is v0.5.2.
What can I use instead of Canicode?
Servers from other publishers that do the same job: melta UI MCP server, HTML to Figma — Design System MCP server and Figma MCP Server.
How does Canicode compare with other Media MCP servers?
safety score 60/100 (higher than 14% of 1,337 Media servers); tools 3 (the typical Media server has 7); tools that change things 0% (typical: 4%. Fewer write tools means less an agent can break). Full comparison.

Alternatives to Canicode

Same job from other publishers: the closest match first, then the best rated.

  • melta UI
    AI-Ready design system MCP: melta UI tokens, component contracts, 107 rules, check_html self-verify
    A
  • HTML to Figma — Design System
    Translate HTML prototypes into Figma using your design system's real components and tokens.
    More from miapre →
    A
  • Figma MCP Server
    The Figma MCP server brings Figma design context directly into your AI workflow.
    A
  • Figma UI
    Bidirectional Figma MCP — AI draws UI on Figma canvas, reads designs back
    A
  • Mlola UI
    Mlola UI components, tokens and design rules for coding agents, with a markup checker
    A