$background-default: rgb(250, 250, 250); // Page canvas — the base background behind all content.
$background-subtle: rgb(245, 245, 245); // Subtly differentiated background for alternating or grouped sections.
$surface-default: rgb(255, 255, 255); // Default container surface — cards, panels, and inputs on the page.
$surface-raised: rgb(255, 255, 255); // Raised surface for higher-elevation layers (menus, popovers, dialogs). Higher elevation reads lighter in dark mode.
$surface-sunken: rgb(245, 245, 245); // Recessed surface for wells and inset regions.
$text-default: rgb(14, 17, 19); // Primary body and heading text.
$text-muted: rgb(73, 80, 84); // Secondary text — supporting copy, captions, metadata.
$text-subtle: rgb(136, 143, 146); // Tertiary text — placeholders and disabled labels. The mid-grey reads in both modes.
$text-inverse: rgb(255, 255, 255); // Text and icons rendered on an action or solid fill.
$text-link: rgb(0, 38, 100); // Inline hyperlink text.
$border-default: rgb(220, 223, 224); // Default border for inputs, cards, and dividers.
$border-subtle: rgb(235, 235, 235); // Low-emphasis border for subtle separation.
$border-strong: rgb(136, 143, 146); // High-emphasis border for focus and selected states.
$action-default: rgb(0, 38, 100); // Primary interactive colour — buttons, links, key accents. NSW navy in light, brightened for contrast in dark.
$action-hover: rgb(0, 16, 55); // Hover and active state for primary actions.
$action-subtle: rgb(240, 251, 255); // Tinted background for low-emphasis (ghost) actions.
$success-surface: rgb(239, 249, 237); // Success (positive outcomes and confirmations) — tinted background.
$success-text: rgb(0, 90, 2); // Success (positive outcomes and confirmations) — readable text on the tint.
$success-border: rgb(143, 199, 138); // Success (positive outcomes and confirmations) — border and divider.
$success-solid: rgb(0, 138, 7); // Success (positive outcomes and confirmations) — solid fill for badges and icons.
$warning-surface: rgb(255, 243, 237); // Warning (caution and pending states) — tinted background.
$warning-text: rgb(136, 47, 3); // Warning (caution and pending states) — readable text on the tint.
$warning-border: rgb(238, 168, 138); // Warning (caution and pending states) — border and divider.
$warning-solid: rgb(201, 80, 0); // Warning (caution and pending states) — solid fill for badges and icons.
$danger-surface: rgb(255, 240, 239); // Danger (errors and destructive actions) — tinted background.
$danger-text: rgb(124, 6, 31); // Danger (errors and destructive actions) — readable text on the tint.
$danger-border: rgb(234, 146, 148); // Danger (errors and destructive actions) — border and divider.
$danger-solid: rgb(184, 18, 55); // Danger (errors and destructive actions) — solid fill for badges and icons.
$info-surface: rgb(233, 238, 247); // Info (neutral information) — tinted background.
$info-text: rgb(25, 51, 102); // Info (neutral information) — readable text on the tint.
$info-border: rgb(128, 152, 194); // Info (neutral information) — border and divider.
$info-solid: rgb(46, 82, 153); // Info (neutral information) — solid fill for badges and icons.