Color
Noctis is a two-accent system: neutrals carry the interface, and a single chromatic accent is held in reserve for signal. The discipline — not the palette — is what keeps it calm.
Primary
bg-primaryPrimary actions
Accent
bg-accentSignal only
Background
bg-backgroundCanvas
Primary acts; the accent only signals.
Primary — neutral white
White is the emphasis color — it fills primary actions and carries headings and most of the interface. It is not a knob: primary is derived, set to the foreground itself (fg-1) and auto-solved against the canvas — so on a light seed it flips to black, never washing out. You theme the seed; primary follows.
Accent — Noctis Blue
The indigo accent is the signal color. It appears rarely, and only where color carries meaning. The accent you seed is emitted verbatim — only its derivatives (hover/active nudges, the on-fill accent-foreground text, accent-muted) and the signal roles (link, focus ring) are solved against the canvas. It stays user-tunable.
Reserved for: focus rings · links · checked controls · text selection & caret · the brand mark.
Background — neutral near-black
A neutral near-black canvas. The engine derives the full surface ramp from it — surfaces lift toward white (unsigned contrast magnitude) carrying only the canvas's own faint neutral chroma, so cards stay neutral and never tint toward the accent. The accent mixes in at exactly one place: the signal tiers.
Surfaces lift toward white, not toward the accent. Read the strip left to right — the neutral surface tiers stay grey, and indigo only surfaces under bg-selected and bg-focus.
Neutral surface
Neutral surface
Neutral surface
Accent signal
Accent signal
States are role shifts
Hover, active, and selected are opaque token shifts — bg-surface-hover, bg-selected, the primary dim — re-derived per scope, never bg-white/90 or an opacity hack. Disabled is the one exception: it dims with opacity, because it is an absence of state, not a color.
Tuning
The seed is exactly three knobs — background, accent, contrast — and these are precisely what System Controls drive. Contrast is the gain: it scales the whole ramp at once, so one slider moves every surface, border, and text tier together. Pick any accent hue and the engine recalibrates its derivatives for contrast; white primary is never a knob.