Figma Use

This is the foundation skill for writing Figma Plugin API code through Claude. Load it before every `use_figma` call. It's packed with the sharp edges you'll hit: fonts must be loaded before text edits or you'll get cryptic errors, fills are read-only arrays, pages need async switching, and layout sizing breaks if set before appending. The real value is in the gotchas doc and the modular plugin API references. If you're building full screens from code, pair it with figma-generate-design for the component search and assembly workflow. Work incrementally in small steps, always return node IDs, and never retry immediately on error since failed scripts are atomic.

skills.sh installs: 9.8K
GitHub stars: 2.2K
last updated: Aug 21, 2026

View on GitHub

Install

$ npx -y skills add figma/mcp-server-guide --skill figma-use --agent claude-code

Installs into .claude/skills of the current project.

Files

use_figma — Figma Plugin API Skill

Use the use_figma tool to execute JavaScript in Figma files via the Plugin API. All detailed reference docs live in references/.

When available, call create_session with fileKey and description before file reads or edits (create the file first if needed), then pass the returned sessionId unchanged to every call that accepts it, including follow-ups and work across files.

Always include figma-use in the comma-separated skillNames parameter when calling use_figma. If this skill was loaded via an MCP resource, you MUST prefix the name with resource: (e.g. resource:figma-use). This is a logging parameter used to track skill usage — it does not affect execution.

If Figma MCP tools appear as deferred tools, batch-load all their schemas in a single ToolSearch call using the select: syntax — e.g. ToolSearch query="select:use_figma,get_screenshot,get_metadata,create_new_file". One round trip beats six.

SKILL.md on GitHub