Tokens

Color, defined once, in OKLCH — paired light and dark.

Theme-aware tokens keep surfaces, copy, actions, and status states aligned with the current color mode.

Palette

Tokens grouped by role.

Light / Dark

Application canvas and default reading colors.

--background
Application canvas.
L oklch(0.982 0.001 275)D oklch(0.185 0.004 285)
--foreground
Default high-emphasis text.
L oklch(0.16 0.005 275)D oklch(0.94 0.002 260)

Surfaces used by cards, popovers, and quiet UI regions.

--card
Structured content surfaces.
L oklch(1 0 0)D oklch(0.205 0.005 260)
--card-foreground
Text on card surfaces.
L oklch(0.16 0.005 275)D oklch(0.94 0.002 260)
--popover
Floating surfaces such as menus and dialogs.
L oklch(1 0 0)D oklch(0.205 0.005 260)
--popover-foreground
Text on floating surfaces.
L oklch(0.16 0.005 275)D oklch(0.94 0.002 260)
--muted
Subtle fills and quiet hover states.
L oklch(0.948 0.0035 275)D oklch(0.245 0.006 260)
--muted-foreground
Secondary and supporting copy.
L oklch(0.48 0.005 275)D oklch(0.68 0.006 260)

Interactive colors used by actions, selections, and emphasis.

--primary
Primary interactive accent.
L oklch(0.205 0.085 285)D oklch(0.82 0.08 285)
--primary-foreground
Text over primary actions.
L oklch(0.985 0.002 275)D oklch(0.18 0.02 285)
--secondary
Secondary controls and soft action fills.
L oklch(0.95 0.003 275)D oklch(0.245 0.006 260)
--secondary-foreground
Text on secondary controls.
L oklch(0.22 0.006 275)D oklch(0.92 0.002 260)
--accent
Accent fills for highlighted UI.
L oklch(0.55 0.17 285)D oklch(0.7 0.14 285)
--accent-foreground
Text over accent fills.
L oklch(0.985 0.002 275)D oklch(0.14 0.012 260)

Borders, inputs, and focus affordances shared by controls.

--border
Rules, dividers, and component edges.
L oklch(0.9 0.005 275)D oklch(1 0 0 / 10%)
--border-muted
Quiet hairlines between sections and list rows.
L oklch(0.925 0.004 275)D oklch(1 0 0 / 5%)
--border-strong
Emphasized edges and frame outlines.
L oklch(0.85 0.006 275)D oklch(0.4 0.006 260)
--input
Input borders and field outlines.
L oklch(0.9 0.005 275)D oklch(1 0 0 / 14%)
--ring
Focus affordance and active outlines.
L oklch(0.62 0.005 275)D oklch(0.58 0.006 260)

Success, warning, and info paired with readable foreground and border tokens.

--success
Positive states and completed work.
L oklch(0.96 0.035 155)D oklch(0.24 0.04 155)
--success-foreground
Text over success backgrounds.
L oklch(0.34 0.095 155)D oklch(0.78 0.11 155)
--success-border
Edges for success surfaces.
L oklch(0.84 0.08 155)D oklch(0.36 0.075 155)
--warning
Cautionary states that need attention.
L oklch(0.96 0.045 85)D oklch(0.25 0.045 85)
--warning-foreground
Text over warning backgrounds.
L oklch(0.43 0.09 70)D oklch(0.82 0.12 85)
--warning-border
Edges for warning surfaces.
L oklch(0.84 0.105 85)D oklch(0.39 0.085 85)
--info
Neutral information and progress states.
L oklch(0.955 0.035 250)D oklch(0.25 0.04 250)
--info-foreground
Text over info backgrounds.
L oklch(0.36 0.1 250)D oklch(0.78 0.105 250)
--info-border
Edges for info surfaces.
L oklch(0.82 0.085 250)D oklch(0.38 0.08 250)

Errors, removals, and destructive actions.

--destructive
Destructive fills for removal and error states.
L oklch(0.51 0.2 25)D oklch(0.75 0.16 25)
--destructive-foreground
Text over destructive backgrounds.
L oklch(0.985 0 0)D oklch(0.18 0.02 285)

Categorical series colors for charts. Distinct from status tokens so data does not imply success or error.

--chart-1
Primary series — brand violet.
L oklch(0.62 0.14 285)D oklch(0.75 0.12 285)
--chart-2
Secondary series — cool blue.
L oklch(0.63 0.12 250)D oklch(0.73 0.1 250)
--chart-3
Tertiary series — gold.
L oklch(0.66 0.11 78)D oklch(0.78 0.11 78)
--chart-4
Quaternary series — green.
L oklch(0.62 0.11 155)D oklch(0.74 0.1 155)
--chart-5
Quinary series — coral.
L oklch(0.64 0.12 35)D oklch(0.75 0.11 35)