designfit MCP

An open-source Model Context Protocol server that validates AI-built front-end implementations against Figma designs using deterministic token and geometry conformance rather than pixel-based screenshot diffing. It extracts design data, validates rendered elements against specified tolerances, and provides machine-actionable fix lists to coding agents to prevent oscillation during UI development.

Package and access

Local package with source-attributed installation metadata. Koskamo does not execute packages during review.

Community listingLocal stdioSource reviewed; not executedPublished by as9978

You need:Install Claude Code — as a plugin: /plugin marketplace add as9978/designfit /plugin install designfit@designfitnpx playwright install chromiumasks once for a Figma personal access token (optional: without it, extract accepts pasted /nodes JSON)

Vendor documentation

What you can do with it

Validate AI-built front-ends against Figma designs
Check design token and geometry conformance
Generate machine-actionable fix lists for coding agents

Source and maintenance

Community listingRegistry 0.2.1

mcp-registry: io.github.as9978/designfit@0.2.1 Source repository Project website

Maintenance checked: Oct 31, 2026, 10:59 PM UTC

Packages and installation

Source-provided package data. Koskamo has not executed or live-probed this package.

designfit 0.2.1

npm

designfit package definition

{
  "version": "0.2.1",
  "transport": "stdio",
  "identifier": "designfit",
  "registryType": "npm",
  "environmentVariables": [
    {
      "name": "FIGMA_TOKEN",
      "description": "Figma personal access token. Lets designfit_extract fetch frames; without it, pass the /nodes JSON instead."
    }
  ]
}

Tools

Reported by the attributed source; not independently observed by Koskamo.

No tool definitions available.

Connect from your client

Each snippet configures the same source-provided package; replace placeholders before use.

This server is operated by the named third party. Listing and endpoint checks are not an endorsement or a security audit. Review the operator's permissions, terms, and data handling before connecting. How listings are checked and corrected.

Cursor

Merge this local stdio configuration, replace every placeholder environment value, and restart Cursor. Koskamo has not executed this package.

Cursor configuration

{
  "mcpServers": {
    "designfit-mcp": {
      "command": "npx",
      "args": [
        "-y",
        "designfit@0.2.1"
      ],
      "env": {
        "FIGMA_TOKEN": "<YOUR_FIGMA_TOKEN>"
      }
    }
  }
}

Cline

Merge this local stdio configuration, replace every placeholder environment value, and restart Cline. Koskamo has not executed this package.

Cline configuration

{
  "mcpServers": {
    "designfit-mcp": {
      "command": "npx",
      "args": [
        "-y",
        "designfit@0.2.1"
      ],
      "env": {
        "FIGMA_TOKEN": "<YOUR_FIGMA_TOKEN>"
      }
    }
  }
}

VS Code

Merge this local stdio configuration, replace every placeholder environment value, and restart VS Code. Koskamo has not executed this package.

VS Code configuration

{
  "servers": {
    "designfit-mcp": {
      "type": "stdio",
      "command": "npx",
      "args": [
        "-y",
        "designfit@0.2.1"
      ],
      "env": {
        "FIGMA_TOKEN": "<YOUR_FIGMA_TOKEN>"
      }
    }
  }
}

Claude Desktop

Merge this local stdio configuration, replace every placeholder environment value, and restart Claude Desktop. Koskamo has not executed this package.

Claude Desktop configuration

{
  "mcpServers": {
    "designfit-mcp": {
      "command": "npx",
      "args": [
        "-y",
        "designfit@0.2.1"
      ],
      "env": {
        "FIGMA_TOKEN": "<YOUR_FIGMA_TOKEN>"
      }
    }
  }
}

Let your agent find its tools

Find servers like designfit MCP from your agent. Add Koskamo once to search the index for endpoints, access requirements, and client setup. Public discovery needs no key.

Connect Koskamo Explore workflows

See all 523