SKILLEMALL.ai

CC figma-generate-design

Use this skill alongside figma-use when the task involves translating an application page, view, or multi-section layout into Figma. Triggers: 'write to Figma', 'create in Figma from code', 'push page to Figma', 'take this app/page and build it in Figma', 'create a screen', 'build a landing page in Figma', 'update the Figma screen to match code', 'convert this modal/dialog/drawer/panel to Figma'. This is the preferred workflow skill whenever the user wants to build or update a full page, modal, dialog, drawer, sidebar, panel, or any composed multi-section view in Figma from code or a description. Discovers design system components, variables, and styles from Code Connect files, existing screens, and library search, then imports them and assembles views incrementally section-by-section using design system tokens instead of hardcoded values.

The skillemall take

The skill promises to automatically push layouts from code or descriptions into Figma, with design system and variable support. Testing revealed broken references and missing files—the description cuts off mid-sentence, signaling structural issues. Quality score 63/100, process score 51/100. No critical errors found, but medium/low findings exist. Three files, no scripts.

The catch is that it relies on Code Connect and existing Figma screens, but without complete documentation and gaps in the package structure, it reads like half-finished work. Install if you're willing to reverse-engineer how it actually works and what it depends on.

anomalyco/opencode Claude Code author: anomalyco MIT 3 files body ≈ 8 944 tokens Open the sourcegithub.com↗ analyzed 5 d ago

Use this skill alongside figma-use when the task involves translating an application page, view, or multi-section layout into Figma.

As a process C 51/100 · Has gaps — References files that are not bundled: ../figma-use/SKILL.md, ../figma-code-connect/SKILL.md, ../figma-use/references/variable-patterns.md

GeneratorFigmaDesigntype and topics are labelled automatically from the skill text
JSON
Technical rating
C
85/100
safety, quality, tests
Safety 60%
100
Quality 40%
63
Run on models
none yet
Process rating
C
51/100
Has gaps
References files that are not bundled: ../figma-use/SKILL.md, ../figma-code-connect/SKILL.md, ../figma-use/references/variable-patterns.md
Tools and files w 18
0
Result and completion w 14
0
Execution cost w 6
40
the three weakest of ten parameters · all ten

The same skill appears in 1 more place: opencode

How to improve

  1. The SKILL.md body is over 5,000 tokens: move reference detail into references/ and load it when needed.
  2. The text references files that are not there: add them or drop the references.
For the model run — optional
  • Your own cases (evals/evals.json, 4–6 real requests with expected answers): the full check would then run those instead of a model-drafted suite.
  • A spec.yaml with trigger phrases and assertions — a behaviour contract for CI; `skilltest init` writes a template.

Guard findings · 0

✓ No critical or high findings

Files scanned: 3. Evidence is masked. Grey chips explain why severity was lowered.

Against the Agent Skills spec

  • warning body-long SKILL.md body ≈ 8944 tokens (recommended < 5000); move details to references/
  • warning missing-ref reference to a missing file: ../figma-use/SKILL.md
  • warning missing-ref reference to a missing file: ../figma-code-connect/SKILL.md
  • warning missing-ref reference to a missing file: ../figma-use/references/variable-patterns.md
  • warning missing-ref reference to a missing file: ../figma-use/references/text-style-patterns.md
  • warning missing-ref reference to a missing file: ../figma-use/references/effect-style-patterns.md
  • warning missing-ref reference to a missing file: ../figma-use/references/component-patterns.md
  • warning missing-ref reference to a missing file: ../figma-generate-library/references/component-creation.md
  • warning missing-ref reference to a missing file: ../figma-use/references/component-patterns.md
  • warning missing-ref reference to a missing file: ../figma-use/references/component-patterns.md
  • warning missing-ref reference to a missing file: ../figma-use/references/gotchas.md
  • warning missing-ref reference to a missing file: ../figma-use/SKILL.md
  • note edit-residue the text marks something as outdated (lines 410): check that old rules are not kept next to new ones — the full check reads the text for contradictions

Process rating: all ten parameters 51/100

Will not run. References files that are not bundled: ../figma-use/SKILL.md, ../figma-code-connect/SKILL.md, ../figma-use/references/variable-patterns.md
  • 0Tools and files. 11 referenced file(s) missing: ../figma-use/SKILL.md, ../figma-code-connect/SKILL.md, ../figma-use/references/variable-patterns.md
  • 0Result and completion. Does not say what the result is
  • 40Execution cost. Instruction body is 8944 tokens: crowds the task out of the window
  • 60Steps. 69 steps, 14 vague phrases
  • 70When it triggers. States when to use, but not when not to
  • 70Inputs and preconditions. Inputs and preconditions are listed
  • 100Failures and branches. 7 branches, has a failure section
  • 100Consistency. Name and required fields are in place
  • 100Running it twice. Mutating operations check current state
  • 100Progress reporting. Reports progress
  • medium Safety rules and hard prohibitions inside a skill: they belong in the system prompt, here they protect nothing
  • high The skill tells the model to perform an irreversible action with no human approval

Everything here is measured from the skill text rather than judged by a model, so the numbers are checkable. A parameter weighs more when it is a more common reason for the process to stall.

Quality signals

  • +5Description has no quoted example phrases that should trigger the skill
  • +4Description does not say when NOT to use the skill (false activations)
  • +3Description length 851: 120–800 characters recommended
  • +3Output format is not stated: the model decides each time
  • +1No license
  • +2Single-language instructions
  • +4Structure: 26 headings
  • +3Step-by-step instructions: 69 items
  • +4Has examples (11 code blocks)
  • +4Reference files are cited in the instructions (2 of 2)

Quality base 70; lint remarks subtract, signals add up to 100. Result: 63.