design-tokens

Designer skill that runs a structured design critique against the brief and codebase—checks visual hierarchy, consistency, aesthetic fidelity, component quality, states, responsive behavior, accessibility (WCAG AA), and typography. Outputs a prioritized Must/Should/Could fix list as DESIGN_REVIEW.md.

Designer skill that defines the structural skeleton of a product before visual design—site maps, navigation models, content hierarchy, user flows, and URL strategy. Interviews the user, scans existing routing/layout code, and outputs an INFORMATION_ARCHITECTURE.md in the .design/<feature-slug>/ folder.

Designer skill for building distinctive, production-grade frontend interfaces guided by named aesthetic philosophies (Dieter Rams, Swiss, Japanese Minimalism/Ma, Brutalist, Scandinavian, and more). Scans existing components, tokens, and Tailwind/MUI/Chakra configs, then writes working code that matches a chosen philosophy.

Creates a design brief through an interactive interview that first scans the codebase for existing tokens, Tailwind configs, theme providers, and component directories, then walks through problem, experience principles, aesthetic direction, constraints, and component inventory. Saves the output as `.design/<feature-slug>/DESIGN_BRIEF.md`.

Designer skill that orchestrates the full design-to-build workflow as a guided sequence: Grill Me, Design Brief, Information Architecture, Design Tokens, Brief to Tasks, Frontend Design, and (on request) Design Review. Runs each sub-skill in order and can resume mid-flow by inspecting the .design/<feature-slug>/ folder.

Interviews the user relentlessly about a plan or design, walking down each branch of the decision tree and resolving dependencies one by one until shared understanding is reached. For every question it also proposes its own recommended answer, and prefers exploring the codebase over asking when possible.

Reads an existing `.design/*/DESIGN_BRIEF.md`, explores the codebase to classify components as reuse/modify/new, and breaks the work into an ordered checklist of independently buildable vertical slices. Tasks are grouped into Foundation, Core UI, Interactions & States, Responsive & Polish, and Review, then saved as `TASKS.md`.