Foundations · design tokens
Colour
The primitive ramps and the semantic tokens that alias into them. Never hardcode a ramp value in a component — bind to a semantic --aha-* token.
◆ generated from tokens.canonical.json — do not edit by hand
Primitive ramps
The raw colour scales (10→100). Semantic tokens below alias into these — never hardcode a ramp value in a component.
purple
5
10
15
20
25
30
35
40
45
50
55
60
70
80
90
100
pink
10
20
30
40
50
60
70
80
90
100
teal
10
20
30
40
50
60
70
80
90
100
coral
10
20
30
40
50
60
70
80
90
100
red
10
20
30
40
50
60
70
80
90
100
yellow
10
20
30
40
50
60
70
80
90
indigo
0
10
15
20
30
40
50
60
70
80
90
95
100
softIndigo
10
20
30
40
50
60
70
80
90
100
lavender
10
20
30
40
50
60
70
80
90
100
gray
0
10
15
20
25
30
35
40
50
55
60
70
80
90
95
100