figma-implement-design — Skills

What it does

Use this skill when the deliverable is code in the user's repository.

If the user asks to create/edit/delete nodes inside Figma itself, switch to figma-use.

If the user asks to build or update a full-page screen in Figma from code or a description, switch to figma-generate-design.

If the user asks only for Code Connect mappings, switch to figma-code-connect-components.

If the user asks to author reusable agent rules (CLAUDE.md/AGENTS.md), switch to figma-create-design-system-rules.

Figma MCP server must be connected and accessible

User must provide a Figma URL in the format: https://figma.com/design/:fileKey/:fileName?node-id=1-2

figma implement design

Source

Repository: https://github.com/openai/skills

figma-implement-design FAQ

What does the figma-implement-design skill do?

Translates Figma designs into production-ready application code with 1:1 visual fidelity. Use when implementing UI code from Figma files, when user mentions "implement design", "generate code", "implement component", provides Figma URLs, or asks to build components matching Figma specs. For Figma canvas writes via `use_figma`, use `figma-use`. Use this skill when the deliverable is code in the user's repository. If the user asks to create/edit/delete nodes inside Figma itself, switch to figma-use.

What does figma-implement-design require?

Issue: Design token values differ from Figma Configuration keys: CLAUDE, AGENTS.

How do I install figma-implement-design?

Run: npx -y skills add https://github.com/openai/skills --skill figma-implement-design --agent claude-code — the source lives at github.com/openai/skills.

Maintain figma-implement-design?

Let people know it's listed here — add the badge (live metrics, light/dark aware) or a plain link to your README or docs.

[figma-implement-design on getagentictools](https://getagentictools.com/skills/openai-skills-figma-implement-design?ref=badge)

npx agentictools info skills/openai-skills-figma-implement-design

The second line is the CLI lookup for this page — handy in READMEs and docs.