One brand colour, warm neutrals. The entire system derives from these four ramps plus
four semantic states. Values live in _palette.json
and flow to Tailwind, CSS variables, and React-Native StyleSheet via the same source.
Ink — warm neutral (canvas, text, borders)
ink 0
#FBF9F5
50
#F5F1EB
100
#E8E3DC
200
#CCC5BD
300
#A89F96
400
#847A72
500
#5A524C
600
#3D3632
700
#2B2623
800
#1F1C19
900
#161311
950
#0B0A08
Stone — warm neutral variant
stone 50
#F7F5F1
100
#EDEAE3
200
#DCD7CC
300
#C3BCAE
400
#A19988
500
#7F7868
600
#635D50
700
#4A453B
800
#332F28
900
#1F1C17
950
#110F0C
Brand — bottle green (primary)
brand 50
#F0F4F1
100
#D6E0D9
200
#ACC1B2
300
#7FA088
400
#557C62
500
#365E44
600
#264832
700
#1C3626
800
#13261B
900
#0C1A12
950
#06110B
Accent — warm gold (secondary moments)
accent 50
#FBF4E6
100
#F4E4C2
200
#E8C888
300
#D9A84F
400
#C08A2C
500
#A0721E
600
#7E5916
700
#5E4110
800
#3F2B0A
900
#231805
Semantic — state colours
success · warning · danger · infoSuccess
50
100
500
600
700
Warning
50
100
500
600
700
Danger
50
100
500
600
700
Info
50
100
500
600
700
Brand soft
Subtle brand tint
Subtle brand tint
Success soft
Low-noise confirmation
Low-noise confirmation
Warning soft
Needs attention
Needs attention
Danger soft
Destructive action
Destructive action