Frontend Design
Guides creation of distinctive, production-grade frontend interfaces that avoid generic AI aesthetics. Generates real working code with exceptional attention to design details.
Usage
/frontend-design # Start with interactive requirements gathering
Respects the project's design system if present — .design-system.md (token
sheet), design-system/SKILL.md (design system packaged as a skill, with
tokens/components/brand assets), or DESIGN.md (full spec). Enforces its hard
rules, runs its review checklist, and records decisions (including rejected
experiments) in its Decisions Log. Can also author a new design system in the
two-layer SKILL.md + DESIGN.md + assets structure.
Covers presentation surfaces (slides, decks) as well as web UI — these invert several web aesthetic rules, so they carry their own legibility floors, one-thesis hierarchy, and focal-surface caps, checked on the rendered artifact rather than by grepping source.