figma-implement-design

github:openai/skills · first seen 2026-10-30 · source · badge

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`.

Works with

figma-code-connect-components
Shares figma, desktop, designs, filekey
0.58
figma-generate-design
Shares figma, translating, switch, implement
0.35
figma-create-design-system-rules
Shares figma, designs, system, design
0.28
figma
Shares figma, urls, design, node
0.24
figma-create-new-file
Shares figma, design, parameter, arguments
0.24

Used with

figma-code-connect-components
Shares figma, desktop, designs, filekey
0.58
figma-generate-design
Shares figma, translating, switch, implement
0.35
figma-create-design-system-rules
Shares figma, designs, system, design
0.28
figma-create-new-file
Shares figma, design, parameter, arguments
0.24
figma
Shares figma, urls, design, node
0.24
figma
Shares figma, filekey, component, components
0.2
figma-generate-library
Shares figma, component, design, system
0.2
screenshot
Shares desktop, figma, pixel, system
0.17

Skill Health 100 (freshness and quality) estimated by backskills

Freshness 100 · Quality 100 · Efficacy not yet tested

Efficacy is shown once a skill has at least 10 use cases or a tools-enabled run. A small preliminary baseline has run and is not counted in this score.

Authors: run your own use cases with POST /api/skill-check (author-verified; never changes this public estimate). Paying never affects ranking. Author tests never change the public score. The public health score only breaks ties between equal matches.

Version history

2026-10-30T20:36:17 · sha256 63f3d12d4445