08.4 —APPROVED PALETTE

Gn8 color palette

Magenta, yellow, and cyan are the approved Gn8 colors. Four neutral themes adapt backgrounds, text, and borders while preserving each color role.

APPROVED · SHARED DESIGN TOKENS Primaryoklch(64% 0.16 320) Secondaryoklch(80% 0.24 96) Tertiaryoklch(72% 0.16 200)

01 primary

Magenta

oklch(64% 0.16 320)

L 64% · C 0.16 · H 320°

02 secondary

Yellow

oklch(80% 0.24 96)

L 80% · C 0.24 · H 96°

03 tertiary

Cyan

oklch(72% 0.16 200)

L 72% · C 0.16 · H 200°

UI SPECIMENS

Applied interface states

Keep the primary brand color unchanged. Pair the darker button-background with near-white button-foreground for approximately 4.53:1 contrast. Use dark on-color text on palette swatches.

01 primary

Magenta state

Use magenta for primary actions and selection states.

Selected View details →

02 secondary

Yellow state

Use yellow to highlight discoveries and noteworthy information, not warnings.

Selected View details →

03 tertiary

Cyan state

Use cyan for information, progress, and supporting graphics. Keep text neutral on light backgrounds.

Selected View details →

COMBINATION

All three in one composition

EXPLORATION · PURPLE AXES

Compare purple, one axis at a time.

Compare hue, lightness, and chroma against the approved color. These candidates are for exploration, separate from the adopted palette.

Hue H

L 64% · C 0.16

Move only the hue in 8° steps, from magenta-purple to blue-purple.

H 336 oklch(64% 0.16 336)

H 328 oklch(64% 0.16 328)

Approved H 320 oklch(64% 0.16 320)

H 312 oklch(64% 0.16 312)

H 304 oklch(64% 0.16 304)

Lightness L

C 0.16 · H 320

Hold hue and chroma steady while moving lightness in 8% steps.

L 80% oklch(80% 0.16 320)

L 72% oklch(72% 0.16 320)

Approved L 64% oklch(64% 0.16 320)

L 56% oklch(56% 0.16 320)

L 48% oklch(48% 0.16 320)

Chroma C

L 64% · H 320

Hold lightness and hue steady while moving chroma in 0.08 steps.

C 0.08 oklch(64% 0.08 320)

Approved C 0.16 oklch(64% 0.16 320)

C 0.24 oklch(64% 0.24 320)

C 0.32 oklch(64% 0.32 320)

EXPLORATION · YELLOW HUE

Move only yellow. Read the whole triad.

Explore yellow hues with magenta and cyan fixed. Your choice changes only the examples below, not the approved site palette.

Fixed: Magenta / cyan
Variable: Yellow H only
Evaluate: Triad relation / sRGB paint

01 · PURE COLOR

Compare unadorned color fields

Keep type outside every field. Names and L / C / H stay separate so the color remains the evidence.

Primary Magenta

L: 64%
C: 0.16
H: 320°

Secondary Yellow

L: 80%
C: 0.24
H: 80°88°96°

Tertiary Cyan

L: 72%
C: 0.16
H: 200°

02 · YELLOW HUE Compare yellow on hue alone

Hold L 80% and C 0.24. Move H alone in 8° steps to inspect apparent vividness and gamut mapping.

Fixed · L 80% / C 0.24

H 80° oklch(80% 0.24 80) Warmer yellow Outside sRGB · R / B H 88° oklch(80% 0.24 88) Middle hue Outside sRGB · B H 96° Approved oklch(80% 0.24 96) Greener yellow Outside sRGB · B

Values render as native CSS OKLCH. All three sit outside sRGB, so browser gamut mapping is part of the evaluation.

03 · UI CONTEXT

Inspect color roles across four named themes

Place the same information on all four neutral palettes. Compare links, progress, and control boundaries in context; inspect role behavior separately from the pure color comparison.

Gn8 Light

RELEASE 08

Release review

Awaiting review

Three changes are ready to review.

Readiness 72%

Gn8 Dark

RELEASE 08

Release review

Awaiting review

Three changes are ready to review.

Readiness 72%

Gn8 Classic Light

RELEASE 08

Release review

Awaiting review

Three changes are ready to review.

Readiness 72%

Gn8 Classic Dark

RELEASE 08

Release review

Awaiting review

Three changes are ready to review.

Readiness 72%