Foundations
The building blocks of Lexicon — colours, typography, spacing, and tokens that underpin every component.
🎨
Colours
Brand palette, semantic tokens, and colour usage guidelines across light and dark modes.
Aa
Typography
Type scale, font families, weights, and line heights for consistent text hierarchy.
↔
Spacing
Spacing scale based on a 4px grid for consistent layout and component sizing.
◐
Border Radius
Corner radius tokens from subtle rounding to fully circular elements.
◇
Elevation
Shadow and layering system for creating depth hierarchy across surfaces.
◻
Icons
Icon set, sizing conventions, and usage guidelines for interface icons.
⊞
Grid
Column grid system, breakpoints, and responsive layout structure.
{ }
Design Tokens
Complete token reference — CSS custom properties, naming conventions, and theme mapping.