How do I install the Figma skill?

Run npx skillmds@latest add acedatacloud/figma in your terminal (requires Node.js), paste this page's agent-chat prompt into Claude, Cursor, or any MCP-connected agent, or download the SKILL.md file and copy it into your agent's skills directory.

Is Figma safe to use?

This skill has not completed SkillMD's automated safety review yet. Capability flags: makes network calls, reads secrets. SkillMD never runs a skill's scripts for you; review the SKILL.md before installing.

Which AI agents work with Figma?

This skill is tagged as working with Claude Code, Claude.ai, OpenAI Codex. SKILL.md is an open format, so most agents that read a skills directory can load it too.

Is Figma free to use?

Yes. Installing skills from SkillMD is free. This skill is licensed under Apache-2.

acedatacloud (@acedatacloud) published this skill. Their other Agent Skills are listed on their SkillMD profile.

Figma by acedatacloud — Agent Skill

Name: Figma
Rating: 4.2 (5 reviews)
Author: acedatacloud

Figma

Read Figma design files, nodes, rendered images and comments via the Figma REST API. Use when the user mentions Figma, a figma.com file link, implementing a design as code, extracting design tokens / colors / spacing, or summarizing comments on a design.

acedatacloud Updated Sep 9, 2026

File contents

Read Figma via curl + jq. The user's OAuth bearer token is in $FIGMA_TOKEN; every call needs Authorization: Bearer $FIGMA_TOKEN. Base URL: https://api.figma.com/v1.

Failures are {"status":<code>,"err":"..."} — show err verbatim. 403 means the token lacks the scope or the file isn't shared with the user. 404 = bad file key.

The file key is the figma.com/file/<KEY>/... or figma.com/design/<KEY>/... segment of a pasted URL. A node id is in ?node-id=1-23 (Figma shows 1:23; the API also accepts 1:23).

F="https://api.figma.com/v1"; AUTH="Authorization: Bearer $FIGMA_TOKEN"
# Who am I (account card)
curl -sS -H "$AUTH" "$F/me" | jq '{handle, email}'
# File document tree (name + top-level frames). Big files: prefer /nodes below.
curl -sS -H "$AUTH" "$F/files/FILE_KEY?depth=2" \
  | jq '{name, pages: [.document.children[] | {name, frames: [.children[]?.name]}]}'

Read specific nodes & render images

KEY="FILE_KEY"
# Just the nodes you care about (faster than the whole file)
curl -sS -H "$AUTH" "$F/files/$KEY/nodes?ids=1:23,1:45" \
  | jq '.nodes | to_entries[] | {id: .key, name: .value.document.name, type: .value.document.type}'

# Render nodes to images — returns temporary CDN URLs (this is the "see it" tool)
curl -sS -H "$AUTH" "$F/images/$KEY?ids=1:23&format=png&scale=2" \
  | jq '.images'   # { "1:23": "https://...png" }

For design-to-code, render the frame to PNG (to view) and read its node JSON (layout/fills/typography) to extract exact colors, spacing and text.

Comments & projects

curl -sS -H "$AUTH" "$F/files/FILE_KEY/comments" \
  | jq '.comments[] | {user: .user.handle, at: .created_at, message}'
# Team projects → files (needs a team id from the Figma URL /team/<id>/...)
curl -sS -H "$AUTH" "$F/teams/TEAM_ID/projects" | jq '.projects'

Gotchas

Node ids: Figma URLs use 1-23 (dash); the API wants 1:23 (colon). Convert.
/images URLs are temporary — download/use them promptly, don't store.
depth= limits tree traversal; omit it only for small files or you'll pull megabytes of node JSON.

---name: figmadescription: Read Figma design files, nodes, rendered images and comments via the Figma REST API. Use when the user mentions Figma, a figma.com file link, implementing a design as code, extracting design tokens / colors / spacing, or summarizing comments on a design.license: Apache-2.0--- Read **Figma** via `curl + jq`. The user's OAuth bearer token is in `$FIGMA_TOKEN`; every call needs `Authorization: Bearer $FIGMA_TOKEN`. Base URL: `https://api.figma.com/v1`. Failures are `{"status":<code>,"err":"..."}` — show `err` verbatim. `403` means the token lacks the scope or the file isn't shared with the user. `404` = bad file key. The **file key** is the `figma.com/file/<KEY>/...` or `figma.com/design/<KEY>/...` segment of a pasted URL. A **node id** is in `?node-id=1-23` (Figma shows `1:23`; the API also accepts `1:23`). ```bash F="https://api.figma.com/v1"; AUTH="Authorization: Bearer $FIGMA_TOKEN" # Who am I (account card) curl -sS -H "$AUTH" "$F/me" | jq '{handle, email}' # File document tree (name + top-level frames). Big files: prefer /nodes below. curl -sS -H "$AUTH" "$F/files/FILE_KEY?depth=2" \ | jq '{name, pages: [.document.children[] | {name, frames: [.children[]?.name]}]}' ``` ## Read specific nodes & render images ```bash KEY="FILE_KEY" # Just the nodes you care about (faster than the whole file) curl -sS -H "$AUTH" "$F/files/$KEY/nodes?ids=1:23,1:45" \ | jq '.nodes | to_entries[] | {id: .key, name: .value.document.name, type: .value.document.type}' # Render nodes to images — returns temporary CDN URLs (this is the "see it" tool) curl -sS -H "$AUTH" "$F/images/$KEY?ids=1:23&format=png&scale=2" \ | jq '.images' # { "1:23": "https://...png" } ``` For design-to-code, render the frame to PNG (to view) and read its node JSON (layout/fills/typography) to extract exact colors, spacing and text. ## Comments & projects ```bash curl -sS -H "$AUTH" "$F/files/FILE_KEY/comments" \ | jq '.comments[] | {user: .user.handle, at: .created_at, message}' # Team projects → files (needs a team id from the Figma URL /team/<id>/...) curl -sS -H "$AUTH" "$F/teams/TEAM_ID/projects" | jq '.projects' ``` ## Gotchas - Node ids: Figma URLs use `1-23` (dash); the API wants `1:23` (colon). Convert. - `/images` URLs are **temporary** — download/use them promptly, don't store. - `depth=` limits tree traversal; omit it only for small files or you'll pull megabytes of node JSON.

Frequently asked questions