coach-admin design system
One system for the coaches behind every program, check-in and payment.
Tokens, components and patterns for SuperCoach and Coach. Two products share one codebase, so every example on this site works in both themes, in English and in Arabic.
Get startedSections
- Get startedSet up the tokens and themes in coach-admin, in code or in Figma.
- FoundationsColor, type, spacing, shape, motion, accessibility and RTL.
- TokensEvery value in the system, searchable by name or hex.
- Componentsshadcn/ui components themed for SuperCoach and Coach.
- PatternsSoonForms, empty states, payments and other flows built from components.
Two products, one stylesheet
The same components read the same semantic tokens in four modes. Coach overrides 14 of them; dark mode changes 36 for SuperCoach and 39 for Coach.
Status
238 tokens · 55 components (48 beta, 7 planned) · open decisions