Figma API

Access and manage design files, components, comments, and projects in Figma workspaces via REST API.

Official docs: https://developers.figma.com/docs/rest-api/

When to Use

Use this skill when you need to:

Read design files and extract components, styles, and frames
Export images from Figma designs in various formats (PNG, JPG, SVG, PDF)
Get file version history and track changes
Manage comments on design files
Access design tokens and styles
Get component information from design systems

Prerequisites

Connect your Figma account via the vm0 platform (OAuth connector). The FIGMA_TOKEN environment variable is automatically configured.

Verify authentication:

curl -s "https://api.figma.com/v1/me" --header "Authorization: Bearer $(printenv FIGMA_TOKEN)" | jq '{id, email, handle}'

Expected response: Your user information (id, email, handle).

Finding File Keys

Figma file URLs contain the file key:

URL: https://www.figma.com/design/abc123XYZ/My-Design-File
File Key: abc123XYZ

The file key is the alphanumeric string between /design/ (or /file/) and the next /.

How to Use

All examples assume FIGMA_TOKEN is set.

Base URL: https://api.figma.com/v1

1. Get Current User

Get information about the authenticated user (no parameters needed):

curl -s "https://api.figma.com/v1/me" --header "Authorization: Bearer $(printenv FIGMA_TOKEN)" | jq '{id, email, handle, img_url}'

2. Get File

Retrieve complete file structure including frames, components, and styles.

Replace <file-key> with your actual file key from a Figma URL.

curl -s "https://api.figma.com/v1/files/<file-key>" --header "Authorization: Bearer $(printenv FIGMA_TOKEN)" | jq '{name, lastModified, version, document: .document.children[0].name}'

3. Get File Nodes

Retrieve specific nodes from a file by node IDs.

Replace <file-key> with your file key and <node-id> with actual node IDs (comma-separated for multiple, e.g., 1:2,1:3).

curl -s "https://api.figma.com/v1/files/<file-key>/nodes?ids=<node-id>" --header "Authorization: Bearer $(printenv FIGMA_TOKEN)" | jq '.nodes'

Node IDs can be found in the file structure or from the Figma URL ?node-id=X-Y parameter (convert - to :).

4. Get File Images

Export nodes as images in PNG, JPG, SVG, or PDF format.

Replace <file-key> with your file key and <node-id> with actual node IDs.

curl -s "https://api.figma.com/v1/images/<file-key>?ids=<node-id>&format=png&scale=2" --header "Authorization: Bearer $(printenv FIGMA_TOKEN)" | jq '.images'

Parameters:

format: png, jpg, svg, pdf (default: png)
scale: 0.5, 1, 2, 4 (default: 1)

5. Get Image Fills

Get download URLs for all images used in a file.

Replace <file-key> with your file key.

curl -s "https://api.figma.com/v1/files/<file-key>/images" --header "Authorization: Bearer $(printenv FIGMA_TOKEN)" | jq '.meta.images'

6. Get File Comments

List all comments on a file.

Replace <file-key> with your file key.

curl -s "https://api.figma.com/v1/files/<file-key>/comments" --header "Authorization: Bearer $(printenv FIGMA_TOKEN)" | jq '.comments[] | {id, message: .message, user: .user.handle, created_at}'

7. Post Comment

Add a comment to a file. Figma requires client_meta with a node_id to anchor the comment.

Replace <file-key> with your file key and <node-id> with an actual node ID.

Write to /tmp/figma_comment.json:

{
  "message": "This looks great!",
  "client_meta": {
    "node_id": "<node-id>",
    "node_offset": { "x": 0, "y": 0 }
  }
}

curl -s -X POST "https://api.figma.com/v1/files/<file-key>/comments" --header "Authorization: Bearer $(printenv FIGMA_TOKEN)" --header "Content-Type: application/json" -d @/tmp/figma_comment.json | jq '{id, message}'

8. Get File Versions

List version history of a file.

Replace <file-key> with your file key.

curl -s "https://api.figma.com/v1/files/<file-key>/versions" --header "Authorization: Bearer $(printenv FIGMA_TOKEN)" | jq '.versions[] | {id, created_at, label, description, user: .user.handle}'

9. Get Project Files

List all files in a project.

Replace <project-id> with your project ID. Project IDs can be found in Figma URLs or from team project listings.

curl -s "https://api.figma.com/v1/projects/<project-id>/files" --header "Authorization: Bearer $(printenv FIGMA_TOKEN)" | jq '.files[] | {key, name, last_modified}'

10. Get Component Sets

Get component sets (variants) in a file.

Replace <file-key> with your file key.

curl -s "https://api.figma.com/v1/files/<file-key>/component_sets" --header "Authorization: Bearer $(printenv FIGMA_TOKEN)" | jq '.meta.component_sets[] | {key, name, description}'

11. Get Component

Get metadata for a specific component.

Replace <component-key> with your component key from the component sets output.

curl -s "https://api.figma.com/v1/components/<component-key>" --header "Authorization: Bearer $(printenv FIGMA_TOKEN)" | jq '{key, name, description, containing_frame}'

Understanding File Structure

Figma files have a hierarchical structure:

FILE
└── CANVAS (page)
    ├── FRAME
    │   ├── RECTANGLE
    │   ├── TEXT
    │   └── GROUP
    │       └── VECTOR
    └── FRAME
        └── COMPONENT

Common node types: CANVAS, FRAME, GROUP, VECTOR, BOOLEAN_OPERATION, STAR, LINE, ELLIPSE, REGULAR_POLYGON, RECTANGLE, TEXT, SLICE, COMPONENT, COMPONENT_SET, INSTANCE

Guidelines

Start with /v1/me: Always verify auth first before calling other endpoints
File key from URL: Extract the file key from Figma URLs (/design/<file-key>/...)
Node IDs: Node IDs are in format X:Y (e.g., 1:2) — in URLs they appear as X-Y, convert - to :
Rate limits: 60 requests per minute; implement backoff for 429 responses
Optimize exports: Use appropriate scale and format for image exports
Pagination: Some endpoints return paginated results; check for next_page in responses