Default pairing
Background
bg-page · #313131
Page, content area
Foreground
fg-body · #f2e2ba
Primary body text
Deploy pipeline ready
Node 07 offline — failover active
Backgrounds
bg-shell
bg-page
bg-surface
bg-active
bg-disabled
bg-border
Foregrounds
fg-heading
fg-body
fg-secondary
fg-caption
fg-muted
Text in context
fg-heading
Heading text
fg-body
Primary body — the system is operational
fg-secondary
Secondary body — node 07 offline
fg-caption
Caption — cluster-01 · us-east-1
fg-muted
LABEL · STATUS · TIMESTAMP
Surface pairings
Overview
fg-heading
Topbar / sidebar
fg-muted
bg-shell
default
Dashboard
fg-body
Page content
fg-secondary
bg-page
Node Alpha
fg-secondary
Cards, panels
fg-caption
bg-surface
Selected row
fg-body
Hover / active
fg-secondary
bg-active
Edge cases — bg3 & bg4
bg-disabled · Disabled surface
Deploy pipeline
Node offline — action unavailable
fg4 only · intentionally muted
bg-border · Borders & dividers only
Input field border
Never use as a text container background