Foundations · Color

Colour

Round 1 (locked): the lexicon-tied multicolor system. Two anchors and eight brand colours, one per lexicon word.

Click any swatch to copy in HEX, RGB, OKLCH, or Tailwind class. Anchors carry the system; lexicon colours give each agent and surface a distinct identity. Source palettes at the bottom show the visual references the system was tuned against.

Anchors

The foundation. Deep ink for type and surfaces; warm cream for backgrounds.

ink

ink-50

#F1F2F5

ink-100

#DDE0E6

ink-200

#B7BDC9

ink-300

#8C95A6

ink-400

#5F6B82

ink-500

#3F4B62

ink-600

#2C3B4D

ink-700

#1B2632

ink-800

#142030

ink-900

#0F1729

ink-950

#0A1019

cream

cream-50

#FBF9F4

cream-100

#F4F1EC

cream-200

#EEE9DF

cream-300

#DAD1C8

cream-400

#C9C1B1

cream-500

#A89C87

cream-600

#85785F

cream-700

#665A47

cream-800

#473F32

cream-900

#2D2820

cream-950

#1A1712

Lexicon palette

One colour per lexicon word. Beat is the brand-default accent; the others give each agent and module its identity.

beat

— Beat

beat-50

#FFF5E5

beat-100

#FFE7C2

beat-200

#FFD08F

beat-300

#FFB162

beat-400

#FF9A33

beat-500

#F98513

beat-600

#D9690A

beat-700

#A35139

beat-800

#7A3C20

beat-900

#522815

beat-950

#2E160B

pulse

— Pulse

pulse-50

#FFF1F4

pulse-100

#FFD9E2

pulse-200

#FFB1C5

pulse-300

#FF8AAA

pulse-400

#FF7099

pulse-500

#FF5C8D

pulse-600

#E04A78

pulse-700

#A6315A

pulse-800

#732553

pulse-900

#561C3F

pulse-950

#2F0F22

wave

— Wave

wave-50

#EEF1FA

wave-100

#D6DEF1

wave-200

#9BACD8

wave-300

#5F77BC

wave-400

#3A57A8

wave-500

#2D4493

wave-600

#223382

wave-700

#1A2871

wave-800

#15205C

wave-900

#111144

wave-950

#080828

spark

— Spark

spark-50

#FFFAEA

spark-100

#FFF1C4

spark-200

#FFE38A

spark-300

#FFD24F

spark-400

#FFC02A

spark-500

#F2AB12

spark-600

#D49108

spark-700

#A06B07

spark-800

#724B07

spark-900

#4A3107

spark-950

#2A1B04

hum

— Hum

hum-50

#EDF7F4

hum-100

#D2EAE2

hum-200

#A2D5C5

hum-300

#6CBEA8

hum-400

#4FB5A8

hum-500

#39998D

hum-600

#2B7B72

hum-700

#235F58

hum-800

#1B4641

hum-900

#13302C

hum-950

#0A1A18

echo

— Echo

echo-50

#FAF1F7

echo-100

#EFD7E8

echo-200

#DFAFD2

echo-300

#C982B6

echo-400

#B05B98

echo-500

#8C3D78

echo-600

#732553

echo-700

#5C1F44

echo-800

#421833

echo-900

#2A1021

echo-950

#180810

surge

— Surge

surge-50

#FFF1ED

surge-100

#FFD9CD

surge-200

#FFAE96

surge-300

#FF7E5C

surge-400

#FF5A35

surge-500

#E63E1A

surge-600

#BF2C0E

surge-700

#94220A

surge-800

#6A1808

surge-900

#430F05

surge-950

#260702

drift

— Drift

drift-50

#F1F4FB

drift-100

#DEE5F2

drift-200

#BBC9E5

drift-300

#9BACD8

drift-400

#7C8FC4

drift-500

#5F75B0

drift-600

#475A91

drift-700

#374576

drift-800

#28335A

drift-900

#1A2240

drift-950

#0E1226

Semantic tokens

Components consume these. Never hard-code primitive values in components.

Token	Maps to	Use
surface	cream-100	Default page background. Warm off-white.
surface-subtle	cream-200	Cards, secondary panels.
surface-muted	cream-300	Inputs, code blocks, hover states.
ink	ink-900	Default text. Deep near-black with warmth.
ink-muted	ink-600	Secondary text, labels.
ink-subtle	ink-500	Tertiary text, placeholders.
border	cream-300	Default borders, dividers.
accent	beat-500	Primary CTA. Brand orange.
accent-hover	beat-600	Hover state for accent.
accent-subtle	beat-50	Selected backgrounds, badges.
success	hum-500	Success states. Hum-coloured.
warning	spark-500	Warning states. Spark-coloured.
danger	surge-500	Destructive. Surge-coloured.
info	wave-500	Informational. Wave-coloured.

Source palettes

Colours extracted directly from the visual references. The lexicon tokens above were tuned against these — saturation, depth, and warmth all trace back here.

colors