# Figma CodeKit MCP (npm · figma-codekit-mcp)

Figma to pixel-perfect code: deterministic HTML/React, then a render + pixel-diff verify loop.

- Trust score: 87/100 (high trust)
- Change this week: +3
- Registry status: active
- Liveness: live
- Owner verified: no
- Last scored: 2026-11-05

## Components

- npm · `figma-codekit-mcp`: 87/100 (this document), [markdown](https://verifymcp.io/servers/mehmoodqureshi-figma-codekit-mcp/figma-codekit-mcp.md), [page](https://verifymcp.io/servers/mehmoodqureshi-figma-codekit-mcp/figma-codekit-mcp)

## Channel facts

- Registry: `npm`
- Package: `figma-codekit-mcp`
- Version: `0.2.4`
- Transport: `stdio`

## Trust breakdown

How this component scores in each security and reliability category. Every signal is checked automatically from public evidence about the published package, including repeated runs of it in an isolated sandbox, and we only credit what we can confirm. Scores are 0–100 per category. Scoring method: https://verifymcp.io/docs/scoring (what has changed: https://verifymcp.io/docs/scoring/changelog)

Scored 2026-11-05.

- **Supply Chain Security**: 92/100
  - No malware found by supply-chain analysis.
  - No known CVEs affecting this package version or its production dependencies.
  - Declares code that runs automatically (postinstall) and that we could not recognise. It may be perfectly ordinary, but we have not established what it does.
  - 33 of 100 dependencies flagged as unhealthy.
- **Provenance & Transparency**: 97/100
  - Source repository is publicly reachable at the declared URL.
  - Cryptographically verified build provenance (signed, bound to Mehmoodqureshi/figma-codekit-mcp).
  - Clear OSI-approved license (MIT).
  - Actively maintained (last published 20 days ago).
  - Disclosure check failed: no security disclosure policy was found in the source repository.
- **Schema Quality & AI Usability**: 69/100
  - AI-judged instruction clarity (excellent).
  - Context-footprint check failed: tool/resource definitions use about 766 tokens (~255/item across 3 items; 3 tools + 0 resources), over budget; trim descriptions and params.
  - Usage-examples check failed: none of the tools include examples.
- **Stability & Change Management**: 70/100
  - Stability observed for 21 of 30 days with no destabilising changes; credit accrues until the full window elapses.
- **Tool Coverage**: 100/100
  - 100% of tools have a non-trivial description (not blank, and not just the tool's name).
  - 100% of tool parameters carry a description.
- **Tool Safety**: 100/100
  - No prompt-injection markers were found in the server instructions, tool names or descriptions we captured.
  - We read all 3 captured tool definition(s), and no name or description among them implies an irreversible operation.
  - An AI judge read all 3 captured unit(s) of tool text and found none that tries to manipulate the model reading it.
- **Capabilities**: 100/100
  - Implements a supported MCP spec version (2025-11-25); the latest is 2026-07-28.

## Install

### How do I install the Figma CodeKit MCP server?

Figma CodeKit MCP runs locally as an npm package, launched with npx -y figma-codekit-mcp. Ready-made configuration for Claude, Cursor, VS Code, Codex and 5 more is on this page, copied from each client's own documentation.

### Claude

```bash
claude mcp add mehmoodqureshi-figma-codekit-mcp -- npx -y figma-codekit-mcp
```

### Cursor

```json
{
  "mcpServers": {
    "mehmoodqureshi-figma-codekit-mcp": {
      "command": "npx",
      "args": [
        "-y",
        "figma-codekit-mcp"
      ]
    }
  }
}
```

### VS Code

```json
{
  "servers": {
    "mehmoodqureshi-figma-codekit-mcp": {
      "command": "npx",
      "args": [
        "-y",
        "figma-codekit-mcp"
      ]
    }
  }
}
```

### Codex

```bash
codex mcp add mehmoodqureshi-figma-codekit-mcp -- npx -y figma-codekit-mcp
```

### opencode

```json
{
  "$schema": "https://opencode.ai/config.json",
  "mcp": {
    "mehmoodqureshi-figma-codekit-mcp": {
      "type": "local",
      "command": [
        "npx",
        "-y",
        "figma-codekit-mcp"
      ],
      "enabled": true
    }
  }
}
```

### OpenClaw

```bash
openclaw mcp add mehmoodqureshi-figma-codekit-mcp --command npx --arg -y --arg figma-codekit-mcp
```

### Hermes

```yaml
mcp_servers:
  mehmoodqureshi-figma-codekit-mcp:
    command: "npx"
    args: ["-y", "figma-codekit-mcp"]
```

### Netclaw

```json
{
  "McpServers": {
    "mehmoodqureshi-figma-codekit-mcp": {
      "Transport": "stdio",
      "Command": "npx",
      "Arguments": [
        "-y",
        "figma-codekit-mcp"
      ]
    }
  }
}
```

### Vellum

```bash
assistant mcp add mehmoodqureshi-figma-codekit-mcp -t stdio -c npx -a -y figma-codekit-mcp
```

### Other

```json
{
  "mcpServers": {
    "mehmoodqureshi-figma-codekit-mcp": {
      "command": "npx",
      "args": [
        "-y",
        "figma-codekit-mcp"
      ]
    }
  }
}
```

## Changelog

Every change recorded for this component, newest first. Days that predate change tracking, or that we cannot explain, say so: "we were watching and nothing happened" and "we were not watching" are different claims.

### 2026-11-04 (score 87, +1)

No change was recorded against any check on this day. Stability & Change Management went from 63 to 67. That category is still filling its 30-day observation window: 19 days of observed history at the previous scan, 20 at this one. The score rises as the window fills, whether or not the server changes.

### 2026-11-02 (score 86, +1)

No change was recorded against any check on this day. Stability & Change Management went from 57 to 60. That category is still filling its 30-day observation window: 17 days of observed history at the previous scan, 18 at this one. The score rises as the window fills, whether or not the server changes.

### 2026-10-31 (score 85, +1)

No change was recorded against any check on this day. Stability & Change Management went from 50 to 53. That category is still filling its 30-day observation window: 15 days of observed history at the previous scan, 16 at this one. The score rises as the window fills, whether or not the server changes.

### 2026-10-29 (score 84, +1)

No change was recorded against any check on this day. Stability & Change Management went from 43 to 47. That category is still filling its 30-day observation window: 13 days of observed history at the previous scan, 14 at this one. The score rises as the window fills, whether or not the server changes.

### 2026-10-26 (score 83, +1)

No change was recorded against any check on this day. Stability & Change Management went from 33 to 37. That category is still filling its 30-day observation window: 10 days of observed history at the previous scan, 11 at this one. The score rises as the window fills, whether or not the server changes.

### 2026-10-24 (score 82, +1)

No change was recorded against any check on this day. Stability & Change Management went from 27 to 30. That category is still filling its 30-day observation window: 8 days of observed history at the previous scan, 9 at this one. The score rises as the window fills, whether or not the server changes.

### 2026-10-23 (score 81, +4)

- [functional improvement] Stability: unverified → 0.27

### 2026-10-15 (score 77)

First indexed and scored.

## MCP tools (3)

### `figma_convert` (~376 tokens)

Convert a Figma frame to code

Fetch a Figma frame and deterministically convert it to self-contained HTML (no LLM). Writes generated.html, reference.png, ir.json and assets.json to a cache dir and returns the paths plus a summary. Pass react=true for a component file, or next=true for a runnable Next.js App Router project you can npm install && npm run dev. Figma responses are cached, so re-running is offline and free unless refresh=true. Follow with figma_verify to see how close the render is.

Input parameters:

- `next` (boolean): Also emit next/ — a runnable Next.js App Router project (package.json, next.config.mjs, app/layout.jsx, app/page.jsx, app/globals.css and the component) that you can npm install && npm run dev as it…
- `outDir` (string): Where to write output. Defaults to .figma-cache/<fileKey>-<nodeId>/
- `react` (boolean): Also emit generated.jsx (React with inline styles) alongside the HTML, plus components/<Name>.jsx for every Code Connect binding it imports.
- `refresh` (boolean): Ignore the cache and re-fetch from the Figma API.
- `responsive` (boolean): Emit the responsive variant (Figma FILL→flex/100%, HUG→fit-content, FIXED→px kept) instead of the exact-sizing variant. A frame with NO Auto Layout has no sizing intent to relax, so it keeps its exac…
- `url` (string, required): Figma frame URL, e.g. https://www.figma.com/design/KEY/Name?node-id=1-2

### `figma_verify` (~282 tokens)

Verify rendered code against the Figma design

Render an HTML file in Chromium, pixel-diff it against the Figma reference, and check each element position with bounding-box IoU, paint order (z-index) and clipping. Returns the diff ratio plus specific instructions on what to fix (MISSING / MISPLACED / WRONG STACKING / OVER-CLIPPED elements, worst regions). Writes render.png and diff.png. Edit the HTML based on the correction and call this again to iterate toward pixel-exact. Read the returned diff.png to see the mismatches highlighted.

Input parameters:

- `dir` (string, required): Cache dir from figma_convert. Supplies reference.png and ir.json.
- `fullPage` (boolean): Capture full scroll height rather than just the viewport.
- `height` (number): Viewport height. Defaults to the design frame height from the IR.
- `htmlPath` (string): HTML file to verify. Defaults to <dir>/generated.html.
- `includeImages` (boolean): Attach reference/render/diff PNGs to the response. Costs a lot of context — prefer reading diff.png from disk only when the numbers alone are not enough.
- `threshold` (number): Diff ratio considered "exact enough". Anti-aliasing puts a floor near 0.005-0.015.
- `width` (number): Viewport width. Defaults to the design frame width from the IR.

### `figma_inspect` (~108 tokens)

Inspect the design structure

Print the IR tree as an indented outline (role, name, box, layout, text, tokens) so you can understand the design structure and find a specific element without reading raw Figma JSON or the whole ir.json. Use after figma_convert.

Input parameters:

- `depth` (number): Max tree depth to print.
- `dir` (string, required): Cache dir from figma_convert.
- `filter` (string): Only show nodes whose name or text matches this (case-insensitive substring).

## Diagnostics

Captured diagnostic sections: Provenance, Install scripts, Dependencies. The full working is on the page: https://verifymcp.io/servers/mehmoodqureshi-figma-codekit-mcp/figma-codekit-mcp#diagnostics

## Score history

- 2026-11-05: 87
- 2026-11-04: 87
- 2026-11-03: 86
- 2026-11-02: 86
- 2026-11-01: 85
- 2026-10-31: 85
- 2026-10-30: 84
- 2026-10-29: 84
- 2026-10-28: 83
- 2026-10-27: 83
- 2026-10-26: 83
- 2026-10-25: 82
- 2026-10-24: 82
- 2026-10-23: 81
- 2026-10-22: 77
- 2026-10-21: 77
- 2026-10-20: 77
- 2026-10-19: 77
- 2026-10-18: 77
- 2026-10-17: 77
- 2026-10-16: 77
- 2026-10-15: 77

## Common questions

### What is the Figma CodeKit MCP server?

Figma CodeKit MCP is listed in the public MCP registry as io.github.Mehmoodqureshi/figma-codekit-mcp. Figma to pixel-perfect code: deterministic HTML/React, then a render + pixel-diff verify loop. This page covers its npm package (figma-codekit-mcp).

### Is the Figma CodeKit MCP server safe to use?

Figma CodeKit MCP scores 87 out of 100 on VerifyMCP. We found no known CVEs affecting it as of 5 November 2026. Its build provenance is signed and verified. That is a record of what we were able to check automatically, not an endorsement. The category breakdown on this page shows every signal behind the number, including the ones we could not confirm.

### What tools does the Figma CodeKit MCP server expose?

Figma CodeKit MCP exposes 3 tools: figma_convert, figma_verify, figma_inspect. Their descriptions and schemas cost roughly 766 tokens of context every time the server is loaded.

### Is the Figma CodeKit MCP server still maintained?

Figma CodeKit MCP is still listed as active in the MCP registry. We last reached this channel on 5 November 2026. Those dates come from our own scans of the registry and the channel itself, not from anything the publisher announced.

### What licence is the Figma CodeKit MCP server under?

Figma CodeKit MCP declares the MIT licence, which is OSI-approved. That covers the source only, and says nothing about the cost of any service it calls.

## Links

- npm package: https://www.npmjs.com/package/figma-codekit-mcp
- Socket report: https://socket.dev/npm/package/figma-codekit-mcp
- Repository: https://github.com/Mehmoodqureshi/figma-codekit-mcp
- Changelog RSS feed: https://verifymcp.io/servers/mehmoodqureshi-figma-codekit-mcp/figma-codekit-mcp.xml
- Changelog JSON feed: https://verifymcp.io/servers/mehmoodqureshi-figma-codekit-mcp/figma-codekit-mcp.json
- HTML version of this page: https://verifymcp.io/servers/mehmoodqureshi-figma-codekit-mcp/figma-codekit-mcp