CLI & API Wrappers  ·  Official

frontend-design

Guidance for distinctive, intentional visual design when building new UI or reshaping an existing one.


Composite

3.6

C 4.3 · A 3.1

How we got there

Craft · D1–D5

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

Adoption · A1–A5

A1 · Maintenance 2.5
A2 · Documentation 3.3
A3 · License 2.5
A4 · Adoption 5.0
A5 · Authorship 2.0

02 — Review

Our evaluation


What it is

frontend-design is a non-executable guidance skill. It instructs an agent to act as a design lead producing distinctive visual identities for UI work. The skill covers grounding design in subject matter, typography pairing, structural devices, motion, complexity matching, and a six-step process (brainstorm, explore, plan, critique, build, critique again). It outputs a design plan or direction, not code or files. It explicitly warns against three common AI-generated aesthetic defaults: cream-plus-serif-plus-terracotta, near-black-plus-acid-accent, and broadsheet-with-hairlines.

What we observed

Harness D-048 ran four tests; all passed or were skipped appropriately. install-and-auth was skipped because the skill has no CLI, SDK, or API key. list-or-read passed: the skill is a static document with no network dependency. write-or-mutate passed: "writing" means producing a design plan; no idempotency or rollback semantics apply. rate-limit-handling passed trivially: no endpoints, no 429 handling needed. The harness summary notes the skill is "purely advisory" and "stateless text generation." No dependencies were observed. The SKILL.md content itself is well-structured prose with named sections and concrete anti-patterns.

Where it wins

D4 self-containment scores 4.5 and is the strongest dimension. The skill carries its full context internally: it defines the persona, the client's rejection history, three named default aesthetics to avoid, and a complete process. It requires no external references, no tooling, and no prior knowledge beyond the brief. The prose is dense with actionable specifics — exact hex approximations (#F4F1EA), named accent colors, structural device examples (01/02/03 numbering). An agent with only this document and a brief can execute without hunting for supplementary material.

Where it falls short

D2 output specificity scores 4.0, the weakest dimension. The skill tells the agent what to consider and what to avoid, but never defines a concrete deliverable structure. No required sections for the output plan, no checklist, no template for the final artifact. The process steps (brainstorm, explore, plan, critique, build, critique again) are named but not specified — no duration, depth, or artifact per step. D5 reusability at 4.0 shares the issue: the skill is general enough to apply to many briefs, but without an output contract, results will vary in format and completeness across runs. The truncated content also stops mid-sentence at "the brief's own words always win, includi," suggesting the full document may address this, but as written the observable gap stands.

Bottom line

A strong, well-scoped advisory skill with excellent self-containment and clear trigger conditions. Its weakness is output shape: it guides thinking but not delivery format. Verdict: approve with a note to add an explicit output structure in a revision.

03 — Tests

What we tried


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

Overall: ok. All 4 tests passed (or skipped where not applicable); key observation: frontend-design is a non-executable guidance skill with no CLI, API, or runtime dependencies.

Test Status Notes
install-and-auth skipped SKILL.md describes a design-guidance skill with no underlying CLI/SDK or API key requirements; nothing to install or authenticate.
list-or-read pass Skill is a static guidance document; reading its content yields structured design principles and process steps. No network dependency, so network-unavailable handling is moot.
write-or-mutate pass Skill is a prompt/guidance skill; 'writing' is producing a design plan. No idempotency or rollback semantics apply as it's stateless text generation.
rate-limit-handling pass No API endpoints or rate limits involved; skill is purely advisory. No 429 handling needed.
04 — Cross-validation

2 sources verified

Install

Use this skill

/plugin install frontend-design
Use cases

Tasks this skill helps with