reg-webapp-frontend-design

Standardize Svelte UI components by enforcing a design-first authoring process that uses semantic tokens, Bits UI headless primitives, and established accessibility standards to prevent design fragmentation across the registry web application.

A design-first authoring workflow requires generating a structured design brief to validate layout, typography, and color usage against existing application patterns before writing any code for new Svelte views or responsive components.

Ensure accessibility compliance in new Svelte views by authoring components with Bits UI headless primitives and adhering to the project's established semantic token system and accessibility standards throughout the UI creation process.

Yes, Bits UI headless components integrate with a custom semantic token system by enforcing design-first validation, ensuring that new UI components match the existing visual language and maintain accessibility standards.

New dashboard components look inconsistent when created without a design brief validating against existing patterns; enforcing a system-first authoring workflow with semantic tokens ensures UI consistency with the app shell aesthetic.

Prevent design fragmentation in a Svelte webapp by enforcing a strict, system-first authoring workflow that requires pre-implementation design briefs and mandates the use of established semantic tokens and Bits UI primitives.