Skip to main content
Reference colors are Sundial’s primitives — the raw material every other color token is built from. Sundial 2.0’s primitives live in tokens/sundial_reference_colors.dart as abstract final class SundialRef, structured on the Radix Colors 12-step model: same step = same job, in light and dark alike.
Don’t use reference colors directly in feature code. Use the semantic tokens (context.colorTheme.*), which pick the right primitive for the current brightness. Legitimate direct uses are rare and deliberate — wallpaper palettes, pinned sign-in chrome, and the token definitions themselves.

The 12-step model

Each scale is a ColorSwatch<int> keyed 1–12. Steps are grouped into bands, and the band tells you the job: Movement within a band is a state change; crossing a band is a change of identity. One step off the canvas is a tint, not a boundary.

Warm sand

The working neutral — sand warmed by an absolute Lab chroma delta (+1.06 at hue 85°) so mid steps stay grey-beige rather than tan. Step 3 is the spacing-true stop (#F2F0ED); the brand book’s light beige lives separately as a brand flat. Light (SundialRef.sandLight):
Dark (SundialRef.sandDark):

Alpha inks

Each mode also carries a translucent ink scale (sandAlphaLight, sandAlphaDark): dark ink for light mode, light ink for dark mode. An alpha step composited over the mode’s canvas reproduces the matching solid step — which means one ink works on any surface, picking up the surface’s own hue in the composite. This is what powers pressed states (ink/pressed), scrims (overlay/scrim = light-alpha 11 in both modes), and the on-brand secondary tier.

Lavender

The accent — a Radix bright scale (sky-templated), tuned periwinkle: step 9 is the pale brand solid #DBE1FD, anchored identically in both modes, and takes dark content. Steps 11–12 are the deep text tiers. The ramp was derived from that single anchor: each step is the previous lavender step moved by the same OKLCH hue shift (−10.6°), with chroma eased near the anchor and kept full on the deep steps, and lightness held so every step keeps its contrast.
This scale is non-monotonic by design: step 9 is lighter than step 8. Never assume step+1 = darker. Line and text stops (light 8, dark 11) are tuned to hold their contrast minimums on the step-5 selected surface, not just the canvas.
Light (SundialRef.lavenderLight):
Dark (SundialRef.lavenderDark):

Brand flats

Mode-invariant spotlight colors from the Brand Guidelines, exposed as constants (SundialRef.brandLavender, .brandGreen, …):
Periwinkle #DBE1FD · Green #9ED99D · Orange #F6CF98 · Yellow #F5EAAC · Dark Beige #CEC5B8 · Light Beige #F4F2EF · White · Black.
Light beige is deliberately not warm sand step 3 (#F2F0ED): the scale keeps its spacing-true step while the brand color keeps the brand-book hex. Nearby, never interchangeable.

Status stops

Cherry (error) and amber (warning) carry five stops each — 100 / 400 / 500 / 600 / 800 — enough for content, solid, border, and surface roles without a full ramp:

The 1.0 ReferenceColors during migration

The 1.0 primitives (tokens/reference_colors.dart) still exist while call sites migrate. The old brand flats (sunflower, grass, tomato, sky, rock, …) have been remapped in place to the nearest 2.0 brand color, so existing consumers already render 2.0 values; the parchment/wood/plum ramps are scheduled for deletion at the end of the migration.