Foundations
Colour
The palette as web tokens
Typography
The type system as web tokens
Tokens
The primitive layer everything else resolves through
Classes
The utility layer, and what each class is allowed to do
Spacing
One scale, and the rule about which layer applies it
Border
Position, width, style and colour, composed
Layout
The hierarchy, and which layer owns which decision
Motion
Four easings, a duration scale, and the page tokens on top
Iconography
The wrapper, the shortcode and the rules the set holds to
Code
Inline code, code blocks and keyboard keys
Mark
Highlighted text, abbreviations and figures
Drop cap
The decorative initial that opens a long read
Divider
A rule between sections, and the tokens that set it
Image
A base class and an aspect ratio, composed