AC design-system-builder
Comprehensive guide for building enterprise-grade component libraries and design systems from scratch. Use this skill when a frontend engineer needs to: (1) set up a component library monorepo with build tooling, (2) establish a Design Token system (colors, typography, spacing, shadows), (3) define component development standards (naming, Props API, TypeScript types, documentation), (4) configure Storybook for interactive docs, (5) implement a theme system with dark mode support, (6) plan component testing strategy (visual regression, interaction tests), or (7) set up a release pipeline (versioning, changelog, npm publishing). Primary stack: React + TypeScript. Also covers Vue 3 patterns where applicable.
As a process C 51/100 · Has gaps — weak spots: result and completion, when it triggers, inputs and preconditions
How to improve
- 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: 8. Evidence is masked. Grey chips explain why severity was lowered.
Against the Agent Skills spec
✓ No remarks against the Agent Skills spec
Process rating: all ten parameters 51/100
- 0Result and completion. Does not say what the result is
- 0Inputs and preconditions. Does not say what the process needs to start
- 0Failures and branches. Linear process with no failure handling
- 0Progress reporting. Says nothing while it works
- 20When it triggers. No condition that starts the skill
- 30Running it twice. 6 mutating operations with no state check
- 100Tools and files. No external tools needed
- 100Steps. 21 steps
- 100Consistency. Name and required fields are in place
- 100Execution cost. Instruction body is 1915 tokens
- low 10 top-level sections: this looks like several domains in one skill
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)
- +3Output format is not stated: the model decides each time
- +1No license
- +2Single-language instructions
- +3Description length 714: enough signal without eating the budget
- +4Structure: 21 headings
- +3Step-by-step instructions: 21 items
- +4Has examples (10 code blocks)
- +4Reference files are cited in the instructions (6 of 6)
Quality base 70; lint remarks subtract, signals add up to 100. Result: 88.