Content & Writing  ·  Official

figma-implement-design

Translates Figma designs into production-ready application code with 1:1 visual fidelity.


Composite

3.7

C 4.6 · A 3.1

How we got there

Craft · D1–D5

D1 · Trigger clarity 5.0
D2 · Output specificity 4.5
D3 · Scope precision 4.5
D4 · Self-containment 5.0
D5 · Reusability 4.0

Adoption · A1–A5

A1 · Maintenance 2.5
A2 · Documentation 3.8
A3 · License 2.5
A4 · Adoption 4.3
A5 · Authorship 2.0

02 — Review

Our evaluation


Tier-2 Review: figma-implement-design

What We Attempted

We evaluated the figma-implement-design skill, which is a structured workflow designed to translate Figma designs into production-ready application code with pixel-perfect fidelity. The skill is intended for use when a user asks to implement UI code from Figma files, generate components, or build interfaces matching Figma specifications. Our test harness attempted to install the skill and perform a smoke-invocation to verify it runs cleanly in a standard environment.

What Failed

Both tests in our harness failed:

  1. Install (fail): The skill does not provide an install command in its SKILL.md. It is not a pip package, npm module, or any form of installable artifact. It is a workflow description—a prompt or agent instruction set—not software that can be installed.

  2. Smoke-invocation (fail): There is no CLI entry point, executable script, or programmatic interface defined. The skill is a set of steps for an AI agent to follow when interacting with Figma MCP servers and a codebase. It cannot be invoked as a standalone tool.

What We Observed

The SKILL.md is well-structured and clearly written. It defines precise triggers (e.g., "implement design", Figma URLs), explicit scope boundaries (distinguishing from figma-use, figma-generate-design, etc.), and a detailed, step-by-step workflow. The skill assumes the presence of a Figma MCP server (remote or desktop) and an existing design system in the user's project. It does not attempt to be a self-contained software package—it is a protocol for an AI agent to follow.

The test harness failure is not a bug in the skill's logic; it is a mismatch between the harness's expectation (installable, invocable tool) and the skill's nature (agent workflow). The skill is designed for use within an AI coding assistant (e.g., Claude Code), not as a standalone utility.

Rating Acknowledgment

The composite score of 4.6 / 5.0 and the auto-summary ("Excellent skill with clear triggers, specific output, precise scope, self-contained, and broadly reusable") are therefore theoretical until the skill can be physically re-run in its intended environment—an AI agent with access to a Figma MCP server and a user's code repository. In that context, the score is plausible: the trigger clarity (5.0), output specificity (4.5), scope precision (4.5), self-containment (5.0), and reusability (4.0) all reflect a well-designed workflow. However, we cannot confirm any of these dimensions from our harness alone.

Value in Principle

Despite the test failures, this skill is valuable in principle. It codifies a complex, multi-step process (extracting node IDs, fetching design context, capturing screenshots, generating code) that an AI agent would otherwise need to improvise. The explicit boundaries prevent the agent from misinterpreting the user's intent (e.g., editing Figma nodes instead of generating code). The workflow includes fallback logic for large responses, which is a practical touch. For teams using Figma with an AI coding assistant, this skill would likely reduce errors and improve consistency. It is not a tool you install—it is a recipe you follow. Our harness simply wasn't built to test that.

03 — Tests

What we tried


Tests simulated against README claims; pending physical re-run in Docker harness. Ran 2026-06-20.

Overall: broken. 0 tests passed, 0 partial, 2 failed; key blocker: skill is a workflow description, not an installable or invocable package.

Inferred dependencies: figma MCP server, figma-desktop MCP (optional).

Test Status Notes
install fail No install command documented in SKILL.md; skill is a workflow definition, not a pip package.
smoke-invocation fail No CLI entry point defined; skill is a prompt/agent workflow, not a standalone executable.
04 — Cross-validation

1 source verified

Install

Use this skill

/plugin install figma-implement-design
Use cases

Tasks this skill helps with