🎨 Design System Foundations
Our foundations are the shared visual language expressed as design tokens in Figma and code.
What’s covered​
- Colors — brand & semantic palettes, accessibility
- Typography — scale, weights, usage
- Spacing & Layout — spacing tokens, grid, breakpoints
- Icons — sizing, naming, usage
- Motion — durations, easing, interaction states
Best practices​
- Prefer semantic tokens in UI layers.
- Validate contrast across light/dark.
- Design in Agnostic Light first, then verify in brand themes and dark mode.