CtrlK
BlogDocsLog inGet started
Tessl Logo

code-to-figma

Export design tokens and page structure from the codebase into a CI pipeline a Figma plugin can consume. Use when asked to "sync code to Figma", "export design tokens to Figma", "set up a Figma sync pipeline", "wire up the tokens-sync-to-figma plugin", "generate a figma-export.json", "create a page walker", or "keep Figma up to date with the codebase".

69

Quality

87%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide
SecuritybySnyk

Passed

No findings from the security scan

SKILL.md
Quality
Evals
Security

Quality

Content

78%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-engineered skill body: command-structured, validation-checkpointed, with excellent progressive disclosure to real, appropriately-scoped reference files. The residual gaps are a repeated boundary statement, project-placeholder paths, and the absence of an explicit failure-recovery loop in the sync workflow.

Suggestions

State the Figma boundary (skill produces the artifact, plugin consumes it) once — in Skill Boundaries — and drop the repeats in the intro and setup step 2.

Add one error-recovery line to `/code-to-figma sync`: if the `jq` validation fails or `GIST_TOKEN` is unset, stop and report rather than pushing a partial or empty export.

Pair the `walk-<site>.mjs` placeholder with a single concrete example (e.g. `walk-site.mjs`) so the commands are copy-paste adaptable without opening the reference file.

DimensionReasoningScore

Conciseness

The body is lean — command tables, numbered steps, and non-obvious justifications ("pnpm writes a script header to stdout ... corrupts a `> file.json` redirect") rather than generic explanations. Minor trimming is possible: the Figma-boundary statement ("this skill does not edit Figma files / plugin is the consumer") appears three times — intro, setup step 2's "Keep the core boundary visible", and the Skill Boundaries section — keeping it just below the every-token-earns-its-place anchor.

4 / 5

Actionability

Concrete executable commands throughout: `node scripts/tokens-to-figma/convert-to-dtcg.mjs`, `jq '.sections | length'`, `gh api gists/<id> --jq '.updated_at'`, `gh secret list --repo <org>/<repo>`, and a full six-step sync sequence. Falls short of fully copy-paste-ready because placeholders (`walk-<site>.mjs`, `<org>/<repo>`) are project-dependent and the actual file specifications for setup live in the reference files — flexibility that is explicitly justified, so this is "mostly executable ... minor gaps" rather than score 5.

4 / 5

Workflow Clarity

Each command has a numbered sequence with explicit checkpoints: sync validates with `jq '.sections | length'` before pushing, update validates with `jq -e '.sections | type == "array"'`, setup lists "Required local checks before relying on CI", and there is a stop-and-ask fallback ("If no static HTML artifact can be produced, stop and tell the user rather than guessing a path"). Missing an explicit error-recovery loop for the sync path (what to do when the jq validation fails or `GIST_TOKEN` is absent), so it sits between the score-4 and score-5 anchors.

4 / 5

Progressive Disclosure

SKILL.md is a clean overview (commands, boundaries, principles) with a dedicated "Reference Files — Load when" table plus point-of-use load instructions ("Load references/setup-scaffold.md for the file specifications"). All five referenced files exist, and cross-links between them are peer-level, keeping references one level deep from SKILL.md with no nested chains. Bulk detail (annotated walker templates, CI YAML, JSON contract) is appropriately split out, matching the clear-overview anchor.

5 / 5

Total

17

/

20

Passed

Description

91%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: third-person, concrete about the what, and equipped with an unusually rich set of natural trigger phrases. The only weaknesses are a slightly condensed action list and unstated directionality that leaves minor overlap risk with Figma-related sibling skills.

DimensionReasoningScore

Specificity

Concrete actions are named — "Export design tokens and page structure", "into a CI pipeline a Figma plugin can consume" — plus artifact-level specifics in the triggers ("generate a figma-export.json", "create a page walker"). Not a score-5 comprehensive action list (extraction, conversion, push, and status operations are condensed into one sentence), but clearly more than the 1-2 concrete actions of score 3.

4 / 5

Completeness

Explicitly answers both: what — "Export design tokens and page structure from the codebase into a CI pipeline a Figma plugin can consume" — and when — "Use when asked to "sync code to Figma", ..." with seven concrete trigger phrases. This matches the anchor for clearly and explicitly answering both what AND when.

5 / 5

Trigger Term Quality

Seven natural quoted trigger phrases cover synonyms and phrasings users would actually say: "sync code to Figma", "export design tokens to Figma", "set up a Figma sync pipeline", "wire up the tokens-sync-to-figma plugin", "generate a figma-export.json", "create a page walker", "keep Figma up to date with the codebase". Coverage includes artifact names and informal phrasings, matching the comprehensive-coverage anchor.

5 / 5

Distinctiveness Conflict Risk

A clear niche (one-directional code→Figma export via CI/Gist) with distinct triggers and a named plugin. Minor overlap risk remains: "keep Figma up to date with the codebase" and "set up a Figma sync pipeline" could plausibly match a bidirectional sync or figma-to-code skill, and the description itself (unlike the body) does not state the one-directional boundary — so it fits the "mostly distinct; minor overlap risk" anchor rather than score 5.

4 / 5

Total

18

/

20

Passed

Validation

93%

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

Validation — 15 / 16 Passed

Validation for skill structure

CriteriaDescriptionResult

referenced_paths_exist

Referenced path issues: 5 missing, 4 deeper-than-1-level

Warning

Total

15

/

16

Passed

Repository
t4sh/skills4sh
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.