Skip to content

Latest commit

 

History

11 Commits

Folders and files

NameName
Last commit message
Last commit date
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Inspect designs, export assets, and collaborate on Figma files through AI.

A Model Context Protocol (MCP) server that exposes Figma's API for reading file structures, exporting images, managing comments, and browsing team components.

Overview

The Figma MCP Server provides deep access to your Figma workspace through AI:

  • Read file document trees, nodes, styles, and component libraries
  • Export nodes as rendered images in multiple formats and scales
  • Post and retrieve comments, and browse team projects and files

Perfect for:

  • Letting AI inspect and describe Figma designs without opening the app
  • Automating asset export pipelines triggered by natural language
  • Surfacing design system components and styles for AI-assisted development

Tools

health_check — Check server readiness

Returns a status object confirming the server is running and reachable.

Inputs: (none)

Output:

{
  "status": "ok",
  "server": "CL Figma MCP Server"
}
get_me — Get authenticated user profile

Returns the profile of the Figma user associated with the connected credential.

Inputs: (none)

Output:

{
  "id": "123456789",
  "email": "user@example.com",
  "handle": "username",
  "img_url": "https://..."
}
get_file — Retrieve a Figma file document tree

Fetches the full document tree of a Figma file. Use depth to limit how deep the node tree is returned and reduce response size.

Inputs:

- `file_key` (string, required)  — Unique key identifying the Figma file (found in the file URL)
- `depth`    (integer, optional) — Depth of the node tree to return (default: full tree)

Output:

{
  "name": "My Design File",
  "lastModified": "2024-01-01T00:00:00Z",
  "document": { "id": "0:0", "name": "Document", "type": "DOCUMENT", "children": [...] }
}
get_file_nodes — Retrieve specific nodes from a file

Fetches one or more specific nodes from a Figma file by their node IDs, rather than the full document tree.

Inputs:

- `file_key`  (string, required)  — Unique key identifying the Figma file
- `node_ids`  (string, required)  — Comma-separated list of node IDs to retrieve (e.g. '1:2,3:4')
- `depth`     (integer, optional) — Depth of the node subtree to return

Output:

{
  "nodes": {
    "1:2": { "document": { "id": "1:2", "name": "Frame", "type": "FRAME" } }
  }
}
get_file_components — List local components in a file

Returns all locally-defined components in a Figma file, including their keys and descriptions.

Inputs:

- `file_key` (string, required) — Unique key identifying the Figma file

Output:

{
  "meta": {
    "components": [
      { "key": "abc123", "name": "Button/Primary", "description": "" }
    ]
  }
}
get_file_styles — List styles defined in a file

Returns all local styles (colors, text, effects, grids) defined in a Figma file.

Inputs:

- `file_key` (string, required) — Unique key identifying the Figma file

Output:

{
  "meta": {
    "styles": [
      { "key": "def456", "name": "Primary/Blue", "style_type": "FILL" }
    ]
  }
}
get_file_versions — Retrieve version history of a file

Returns the full version history of a Figma file, including version labels and timestamps.

Inputs:

- `file_key` (string, required) — Unique key identifying the Figma file

Output:

{
  "versions": [
    { "id": "v1", "label": "Final Review", "created_at": "2024-01-01T00:00:00Z" }
  ]
}
get_images — Export nodes as rendered image URLs

Renders one or more nodes as images and returns signed download URLs. Supports PNG, JPG, SVG, and PDF formats.

Inputs:

- `file_key`  (string, required)  — Unique key identifying the Figma file
- `node_ids`  (string, required)  — Comma-separated list of node IDs to export (e.g. '1:2,3:4')
- `scale`     (float, optional)   — Export scale factor between 0.01 and 4 (default: 1)
- `format`    (string, optional)  — Image format: 'jpg', 'png', 'svg', or 'pdf' (default: 'png')

Output:

{
  "images": {
    "1:2": "https://figma-alpha-api.s3.us-west-2.amazonaws.com/..."
  }
}
get_image_fills — Retrieve image fill download URLs

Returns download URLs for all images embedded in a Figma file as image fills on nodes.

Inputs:

- `file_key` (string, required) — Unique key identifying the Figma file

Output:

{
  "meta": {
    "images": { "imageRef123": "https://..." }
  }
}
get_comments — List comments on a file

Returns all comments on a Figma file, including resolved and unresolved threads.

Inputs:

- `file_key` (string, required) — Unique key identifying the Figma file

Output:

{
  "comments": [
    { "id": "c1", "message": "Looks good!", "resolved_at": null }
  ]
}
post_comment — Post a comment on a file

Adds a new comment to a Figma file on behalf of the authenticated user.

Inputs:

- `file_key` (string, required) — Unique key identifying the Figma file
- `message`  (string, required) — The comment text to post

Output:

{
  "id": "c2",
  "message": "Please update the button radius.",
  "created_at": "2024-01-01T00:00:00Z"
}
get_team_projects — List projects in a team

Returns all projects belonging to a Figma team.

Inputs:

- `team_id` (string, required) — The Figma team ID

Output:

{
  "projects": [
    { "id": "12345", "name": "Design System" }
  ]
}
get_project_files — List files in a project

Returns all files within a specific Figma project.

Inputs:

- `project_id` (string, required) — The Figma project ID

Output:

{
  "files": [
    { "key": "abc123", "name": "Components v2", "last_modified": "2024-01-01T00:00:00Z" }
  ]
}
get_team_components — List published components in a team library

Returns all published components available in a Figma team's shared component library.

Inputs:

- `team_id` (string, required) — The Figma team ID

Output:

{
  "meta": {
    "components": [
      { "key": "ghi789", "name": "Icon/Close", "file_key": "abc123" }
    ]
  }
}
get_component — Get a specific published component

Retrieves metadata for a single published component by its unique component key.

Inputs:

- `component_key` (string, required) — The unique key of the published component

Output:

{
  "meta": {
    "key": "ghi789",
    "name": "Icon/Close",
    "description": "Close icon, 24px",
    "file_key": "abc123"
  }
}

API Parameters Reference

Common Parameters
  • file_key — The unique identifier of a Figma file, extracted from its URL: figma.com/file/{file_key}/...
  • node_ids — Comma-separated node IDs in {pageId}:{nodeId} format, e.g. 1:2,3:4
  • depth — Integer controlling how many levels of the node tree to return; omit for the full tree
Resource ID Formats

File Key:

{alphanumeric string from URL}
Example: aBcDeFgHiJkLmNoP

Node ID:

{page}:{node}
Example: 1:2  (page 1, node 2)

Team ID:

{numeric string}
Example: 123456789

Project ID:

{numeric string}
Example: 987654321
Image Export Formats
  • png — Raster, default format (default scale: 1×)
  • jpg — Raster, smaller file size, no transparency
  • svg — Vector, ideal for icons and simple shapes
  • pdf — Vector, suitable for print

Scale range: 0.01 – 4 (e.g. 2 for @2x retina export)

Troubleshooting

Missing or Invalid Headers
  • Cause: Figma credential not provided in request headers or incorrect format
  • Solution:
    1. Verify Authorization: Bearer YOUR_API_KEY and X-Mewcp-Credential-Id: CREDENTIAL-ID headers are present
    2. Check the credential is active in your MewCP account
Insufficient Credits
  • Cause: API calls have exceeded your request limits
  • Solution:
    1. Check credit usage in your Curious Layer dashboard
    2. Upgrade to a paid plan or add credits for higher limits
    3. Contact support for credit adjustments
Credential Not Connected
  • Cause: No Figma credential linked to your account
  • Solution:
    1. Go to Credentials in your MewCP dashboard
    2. Connect your Figma account (OAuth)
    3. Retry the request with the correct X-Mewcp-Credential-Id header
Malformed Request Payload
  • Cause: JSON payload is invalid or missing required fields
  • Solution:
    1. Validate JSON syntax before sending
    2. Ensure all required tool parameters are included
    3. Check that node_ids is a comma-separated string, not an array
Server Not Found
  • Cause: Incorrect server name in the API endpoint
  • Solution:
    1. Verify endpoint format: {server-name}/mcp/{tool-name}
    2. Use correct server name from documentation
    3. Check available servers in your Curious Layer account
Figma API Error
  • Cause: Upstream Figma API returned an error
  • Solution:
    1. Check Figma service status at Figma Status Page
    2. Verify your credential has access to the file or team being queried
    3. Review the error message for specific details (e.g. file not found, insufficient permissions)

Resources

Releases

Packages

Contributors

Languages