CtrlK
BlogDocsLog inGet started
Tessl Logo

design-system

Build or audit a design system including component library, design tokens, naming conventions, contribution model, and documentation. Use this skill whenever the user wants to build a design system, audit an existing system, define design tokens at the system level, structure a component library, or set up design system governance. Triggers on design system, component library, design tokens, atomic design, atoms, molecules, organisms, design system documentation, Storybook, Figma library, system governance, design contribution model. Also triggers when teams are inconsistent across products and a system is the answer.

71

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-organized methodology skill with strong progressive disclosure and concrete checklists. The main gaps are a few high-level workflow steps and the absence of explicit validation checkpoints, though the operations are non-fragile.

Suggestions

Tighten the 'Why this layer matters' rationale and repeated Output lists to lift conciseness toward fully lean.

Add one concrete checkpoint or definition-of-done per workflow phase (e.g. 'confirm token set is documented before building elements') to make sequencing more verifiable.

Make 'Establish governance' actionable by listing the minimum artifacts (owner roster, proposal template, review cadence) rather than only naming the dimensions.

DimensionReasoningScore

Conciseness

Mostly lean bullet structure that assumes Claude's competence and avoids explaining basics, but a few rationale lines ('Without tokens, the system has no foundation') and repeated 'Output:' lists could be trimmed.

4 / 5

Actionability

Concrete per-element/per-component documentation checklists, a specific token-naming example (color-blue-600 / color-text-link), and a defined 6-section audit report; a few workflow steps like 'Establish governance' remain high-level.

4 / 5

Workflow Clarity

Two clearly sequenced numbered workflows (9 steps for new system, 6 for audit) with implicit ordering, but no explicit validation checkpoints — acceptable because this is planning/methodology rather than a fragile destructive or batch operation.

4 / 5

Progressive Disclosure

Well-structured overview (When to use/not, inputs, 5-layer framework, workflows, failure patterns, output format) with clearly signaled one-level-deep references to three real files (system-architecture.md, system-audit-template.md, governance-playbook.md).

5 / 5

Total

17

/

20

Passed

Description

96%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, explicit description that clearly states both capabilities and trigger conditions with comprehensive natural keywords. The only soft spot is some overlap risk with adjacent design skills that share token and component vocabulary.

Suggestions

Add a one-clause boundary cue in the description (e.g. 'system-level, not page-level') to further separate it from design-standards and reduce token/component trigger overlap.

DimensionReasoningScore

Specificity

Lists multiple concrete actions — 'Build or audit a design system including component library, design tokens, naming conventions, contribution model, and documentation' — with comprehensive coverage of the skill's deliverables.

5 / 5

Completeness

Explicitly answers both what ('Build or audit a design system including…') and when ('Use this skill whenever the user wants to…' plus 'Triggers on…'), with concrete trigger phrases.

5 / 5

Trigger Term Quality

'Triggers on design system, component library, design tokens, atomic design, atoms, molecules, organisms…Storybook, Figma library, system governance' gives comprehensive natural-term coverage including synonyms and tool names users actually say.

5 / 5

Distinctiveness Conflict Risk

Clear system-level niche with distinct triggers, but 'design tokens' and 'component library' overlap with closely related sibling skills (design-standards, brand-identity) that handle page-level and brand-token work, so minor conflict risk remains.

4 / 5

Total

19

/

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.

Validation15 / 16 Passed

Validation for skill structure

CriteriaDescriptionResult

frontmatter_unknown_keys

Unknown frontmatter key(s) found; consider removing or moving to metadata

Warning

Total

15

/

16

Passed

Repository
rampstackco/claude-skills
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.