@nvanexan/figma-mcp
Figma MCP server for GitHub Copilot coding agent — PAT auth via STDIO.
Extracts design context (layout, styles, typography, effects) from Figma files as CSS-like properties, and exports rendered images of Figma nodes. Built on the Model Context Protocol.
Install
npm install -g @nvanexan/figma-mcp
Or use directly with npx:
npx @nvanexan/figma-mcp
Setup
Set your Figma Personal Access Token as an environment variable:
export FIGMA_API_KEY=your-figma-pat
You can generate a token in Figma under Settings > Personal Access Tokens.
GitHub Copilot / Claude Code
Add the server to your MCP configuration:
{
"mcpServers": {
"figma": {
"command": "npx",
"args": ["-y", "@nvanexan/figma-mcp"],
"env": {
"FIGMA_API_KEY": "your-figma-pat"
}
}
}
}
Tools
get_figma_context
Extracts design context from a Figma URL and returns a simplified node tree with CSS-like properties (flexbox layout, colors, typography, effects, dimensions).
| Parameter | Type | Required | Description |
|---|---|---|---|
figmaUrl | string | yes | Figma file URL (with optional node-id) |
depth | number | no | Node tree depth, 1–10 (default: 3) |
get_figma_image
Exports a rendered image of a Figma node.
| Parameter | Type | Required | Description |
|---|---|---|---|
figmaUrl | string | yes | Figma URL with a node-id |
format | string | no | png, jpg, svg, pdf (default: png) |
scale | number | no | 0.01–4 (default: 2) |
Development
npm install
npm run build
npm test
Scripts
| Script | Description |
|---|---|
npm run build | Compile TypeScript to dist/ |
npm run lint | Lint source with ESLint |
npm test | Run tests |
npm run test:watch | Run tests in watch mode |
npm run test:coverage | Run tests with coverage report |
Releasing
This project uses GitHub Actions for CI and publishing.
To release a new version:
- Update the version in
package.jsonfollowing semver:npm version patch # 0.1.0 → 0.1.1 (bug fixes) npm version minor # 0.1.0 → 0.2.0 (new features) npm version major # 0.1.0 → 1.0.0 (breaking changes) - Push the commit and tag:
git push origin main --follow-tags - The CI pipeline will automatically run tests and publish to npm.
License
MIT