Use the installed figma CLI. Start with figma status. If it reports
not_connected, run figma authorize-url and share only the returned
connect_url with the user.
OAuth uses Dynamic Client Registration and PKCE through authd. Figma issues a per-registration confidential client; authd stores its generated secret outside the runtime cell, so credentials must never be requested in chat.
Run figma list-tools to inspect the live provider catalogue and schemas,
then call an advertised tool with:
figma call-tool --name <tool> --arguments-json '<json-object>'
list-tools exposes only reviewed Figma tools and includes each tool's
hatch_permission, hatch_action, and hatch_permission_label. Unknown or
new provider tools remain unavailable until reviewed. Read permissions follow
the user's connector settings; design, file, asset, Code Connect, plugin, and
shader changes require granular approval. Do not retry a failed or timed-out
write automatically because its side effect may have completed.
Load Figma's provider skills
Before calling a tool whose description requires a Figma skill, fetch that
skill with get_figma_skill and follow its prerequisites. These skill://
URIs refer to resources on Figma's MCP server. For example, before
create_new_file, read:
figma call-tool --name get_figma_skill --arguments-json '{"uri":"skill://figma/figma-create-new-file/SKILL.md"}'
Use the skill URI advertised by the tool. If the relevant URI is unknown,
fetch skill://index.json with the same tool and select the matching skill.
Fetch supporting references only as needed, resolving relative paths against
the parent skill URI. Reuse guidance already loaded for the current task;
there is no need to install or copy these provider skills into the local
skill directory. Skill reads use the designs.read permission.
Call get_figma_skill only when advertised by list-tools. If the tool is
unavailable or Figma confirms that a skill is missing, continue using the
live tool description, schema, and local guides only when the skill is
optional (for example, "if it exists"). If the skill is required
unconditionally, stop the dependent operation and report the missing
guidance. Authentication failures, permission denials, timeouts, and other
read errors do not establish that a skill is missing. Avoid repeated failed
lookups; continue work that does not depend on the unavailable guidance.
Choose the workflow
Read only the guide that matches the task before calling provider tools:
- Implement a Figma design in code: design-to-code
- Create or edit canvas content with
use_figma: canvas editing - Generate a FigJam diagram: diagrams
- Create Code Connect mappings: Code Connect
For a Figma URL, extract its fileKey and node-id; convert node IDs from URL
form (123-456) to API form (123:456). Inspect the live schema before
constructing arguments because Figma can add optional fields without changing
this skill.
Avoid redundant catalogue, context, screenshot, and validation calls. Figma applies account- and seat-dependent usage limits, and repeated reads can consume a user's small monthly allowance. Reuse results gathered earlier in the task.