Design UI component specifications
design-componentskillsetup L1★211
plugin87/ux-ui-agent-skills ↗What it does
Design a component spec with anatomy, variants, states, and token mapping
Best for
Component design specification when a new UI pattern must be formally documented before or alongside code implementation.
Inputs
- · component name
- · WCAG checklist
- · existing tokens
Outputs
- · component spec (anatomy/variants/sizes/states)
- · token mapping
- · ARIA pattern
- · accessibility notes
Preconditions
Component not yet spec'd; token system available; ARIA pattern library reference present
Failure modes
Missing a state; token not referenced; ARIA role incorrect; contrast not verified; no 8-state table
Trust signals
- · plugin87/ux-ui-agent-skills repo
- · atomic design categories
- · scaffold_component.py automation