CtrlK
BlogDocsLog inGet started
Tessl Logo
SkillPublic

figma

Use the Figma MCP server to fetch design context, screenshots, variables, and assets from Figma, and to translate Figma nodes into production code. Use when a task involves Figma URLs, node IDs, design-to-code implementation, or Figma MCP setup and troubleshooting. Covers general Figma data fetching and exploration. Do NOT use when the goal is specifically pixel-perfect code implementation from a Figma design (use figma-implement-design instead).

Quality

89%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide
SecuritybySnyk

Low

Low-risk findings worth noting

SKILL.md
Quality
Evals
Security

Quality

Content

85%Weight 40%Scale 1-5

Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.

A well-structured instruction-only skill body: an explicit ordered flow with a truncation recovery loop and validation gate, concrete tool names, and clean one-level-deep references to real bundle files. Only minor duplication and slightly vague asset-download guidance keep conciseness and actionability at 4.

DimensionReasoningScore

Conciseness

Lean, directive body with no background exposition Claude already knows, but with minor duplication that could be trimmed: flow step 6 ('Validate against Figma for 1:1 look and behavior before marking complete') repeats the implementation-rules bullet ('Validate the final UI against the Figma screenshot for both look and behavior'), and the link-based prompting section restates usage reminders also in references/figma-mcp-config.md. Anchor 4, not 5, because of these trimmable repetitions.

4 / 5

Actionability

Concrete, executable guidance naming the exact tools in order (get_design_context, get_metadata, get_screenshot) with a truncation fallback; as an instruction-only skill, absence of code is not penalized. Not 5 because 'download any assets needed' and the 'assets endpoint' are left vague compared to the fully specified tool calls.

4 / 5

Workflow Clarity

'Required flow (do not skip)' gives a clear 6-step sequence with an explicit conditional recovery branch (truncated response -> get_metadata -> re-fetch only required nodes) and an explicit validation gate ('Validate against Figma for 1:1 look and behavior before marking complete'). Not a destructive/batch operation, so the cap does not apply; matches anchor 5.

5 / 5

Progressive Disclosure

The body is a well-organized ~42-line overview; setup/troubleshooting is appropriately split to references/figma-mcp-config.md and the tool catalog to references/figma-tools-and-prompts.md, both real files one level deep and clearly signaled in the References section with one-line descriptions. Matches anchor 5.

5 / 5

Total

18

/

20

Passed

Description

87%Weight 40%Scale 1-5

Based on the skill's description, can an agent find and select it at the right time? Clear, specific descriptions lead to better discovery.

A strong description: concrete capabilities, explicit 'Use when' triggers, third-person imperative voice, and explicit boundary guidance against a sibling skill. The only weaknesses are slightly incomplete natural-term coverage and capabilities that stop just short of comprehensive.

DimensionReasoningScore

Specificity

Lists several concrete actions ('fetch design context, screenshots, variables, and assets from Figma, and to translate Figma nodes into production code') with only minor coverage gaps. Not 5 because setup/configuration actions are only implied through trigger terms rather than stated as capabilities; well above 3's 1-2 concrete actions.

4 / 5

Completeness

Explicitly answers both what ('Use the Figma MCP server to fetch design context... and to translate Figma nodes into production code') and when ('Use when a task involves Figma URLs, node IDs, design-to-code implementation, or Figma MCP setup and troubleshooting'), with concrete trigger phrases and even a negative trigger. Matches anchor 5.

5 / 5

Trigger Term Quality

Good natural trigger coverage ('Figma URLs, node IDs, design-to-code implementation, or Figma MCP setup and troubleshooting') but misses common variations users would say such as 'Figma design', 'Figma file', or 'figma.com link'. Fits anchor 4 rather than 5's comprehensive synonym/extension coverage.

4 / 5

Distinctiveness Conflict Risk

Clear niche (Figma MCP data fetching/translation) with explicit disambiguation: 'Do NOT use when the goal is specifically pixel-perfect code implementation from a Figma design (use figma-implement-design instead)'. Minimal conflict risk; matches anchor 5.

5 / 5

Total

18

/

20

Passed

Validation

100%

Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.

Validation — 16 / 16 Passed

Validation for skill structure

No warnings or errors.

Repository

tech-leads-club/agent-skills

Path

packages/skills-catalog/skills/(design)/figma/SKILL.md

Reviewed

Table of Contents

Is this your skill?

If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.