Design Principles
These principles guide every decision in the Atelier Design System, from API design to visual language.
Accessible by default
Every component ships with correct ARIA roles, keyboard navigation, and focus management. Accessibility is not an afterthought -- it is a design constraint that shapes every API decision.
Composable over configurable
Primitives expose compound-component APIs so consumers can compose exactly the UI they need without fighting prop sprawl. Small, focused pieces combine into complex patterns.
Token-driven
Visual decisions live in design tokens, not in component code. Colours, spacing, typography, and radii are CSS custom properties generated by Style Dictionary, making themes and brands trivial to swap.
Progressive disclosure
Defaults should cover the common case. Advanced behaviour is available through optional props and composition, never forced on every consumer.
Framework-agnostic styling
CSS Modules and custom properties keep styles scoped, portable, and free of runtime overhead. No utility-class framework is required.
Ship less, ship right
A small set of well-tested, well-documented primitives is more valuable than a large set of half-finished ones. Quality gates include unit tests, axe audits, and visual regression checks.