02 / Foundations

Colour

Lexicon's palette is theme-aware and brand-scoped. Every value resolves through a CSS custom property — the names below are the only API.

Surfaces

--color-bg#16161A

--color-surface#1C1C22

--color-surface-2#24242B

--color-stage#1C1C22

--color-stage-dot#35353D

--color-text#ECEAE4

--color-text-2#C5C6CA

--color-text-muted#A1A1AA

--color-text-faint#A1A1AA

--color-border#2A2A30

--color-border-strong#3C3C42

--color-accent#7AA0D4

--color-accent-soft#1F2A3C

--color-success#7ACB8E

--color-success-soft#1B2620

--color-warn#E3BE78

--color-warn-soft#2A2317

--color-do-accent#6BB57D

--color-do-surface#1B231E

--color-dont-accent#D87878

--color-dont-surface#24191A

Body text uses --color-text-2 (floor: #C5C6CA).
Secondary text uses --color-text-muted (floor: #A1A1AA).
Never use a colour value below the secondary floor for text content.
--color-text-faint is for non-text decoration only — separator dots, subtle borders. Same hex as muted; the distinction is semantic.