Foundations / Colours

Brand and semantic colours from the current shared truth.

Shared colours should come from `packages/brand`, with semantic tokens driving components and surface styles. Raw brand colours exist as source values, but shared UI should mostly consume semantic roles.

Brand source colours

navy

#24364a

--color-brand-navy

slate

#6a7c90

--color-brand-slate

success

#09b67a

--color-brand-success

cta

#ff7800

--color-brand-cta

highlight

#edc74c

--color-brand-highlight

text

#323232

--color-brand-text

background

#ffffff

--color-brand-background

Semantic colour tokens

These are the tokens components should generally consume. They express purpose rather than literal colour names.

primary

#24364a

--color-primary

primaryHover

#1e2e3f

--color-primary-hover

primarySoft

#e9eef2

--color-primary-soft

accent

#09b67a

--color-accent

accentHover

#08a86f

--color-accent-hover

page

#f8fafc

--color-page

surface

#ffffff

--color-surface

surfaceMuted

#f8fafc

--color-surface-muted

surfaceStrong

#111827

--color-surface-strong

borderSubtle

#e2e8f0

--color-border-subtle

borderDefault

#cbd5e1

--color-border-default

textPrimary

#111827

--color-text-primary

textHeading

#0f172a

--color-text-heading

textMuted

#475569

--color-text-muted

textSubtle

#64748b

--color-text-subtle

textInverse

#f8fafc

--color-text-inverse

link

#1e2e3f

--color-link

info

#2563eb

--color-info

warning

#f59e0b

--color-warning

danger

#dc2626

--color-danger

dangerSoft

#fef2f2

--color-danger-soft

successSoft

#ecfdf5

--color-success-soft

overlay

rgba(15, 23, 42, 0.45)

--color-overlay

Theme surface comparison

Theme default

surfacePage

#f8fafc

surfaceBase

#ffffff

surfaceCard

#ffffff

surfaceMuted

#f8fafc

surfaceSidebar

#ffffff

textPrimary

#111827

textStrong

#0f172a

textHeading

#0f172a

Theme dark

surfacePage

#0f172a

surfaceBase

#111827

surfaceCard

#111827

surfaceMuted

#0b1220

surfaceSidebar

#111827

textPrimary

#e5e7eb

textStrong

#f8fafc

textHeading

#f8fafc