elegant

To generate UI component documentation, request design-system guidelines by specifying required component states, design tokens, and accessibility acceptance criteria. This produces deterministic, foundation-first rules with explicit do/don't constraints and testable QA checklists.

Token-driven typography uses defined variables for color, spacing, and specific typography scales with required font and weight choices. It standardizes UI styling rules to ensure consistent visual foundations across components without ad hoc styling decisions.

Apply WCAG 2.2 AA guidelines by enforcing keyboard-first interaction expectations and visible focus-state requirements within component documentation. This accessibility-forward guidance ensures testable acceptance criteria are met for all user interactions.

Yes, the design system approach works for responsive component states by producing component-level guidance that explicitly defines required states, variants, and responsive behavior alongside deterministic styling rules and testable acceptance criteria.

The best way to standardize UI color and spacing tokens is defining concrete semantic values like primary, secondary, success, warning, danger, surface, and text. This token-driven foundation enforces consistent styling across component documentation.

UI component guidelines lack testable acceptance criteria when foundation-first rule ordering and explicit do/don't constraints are missing. Enforcing deterministic guideline structure with accessibility and QA checklists resolves this implementation gap.