Color Palette

Core tokens defined as CSS custom properties on :root. Use var(--forge-*) for all color references.

bg

surface

surface-2

amber

cyan

orange

emerald

text

text-2

text-3

text-4

Usage

Always reference tokens via var(--forge-amber) rather than hard-coding hex values. This ensures theme-wide consistency.

Typography

Body text in Open Sans. Lorem ipsum dolor sit amet, bold text, cyan link, and inline code.

Support text — smaller, muted.

Label font Section label

Gradient text (amber → cyan)

text-amber text-cyan text-dim text-dim-2 text-muted-4

Font stacks

--font-display Proxima Nova Black 900 · body / --font-label Open Sans · --font-mono Courier New

The design system relies on Bootstrap 5's spacing utilities (.p-*, .m-*, .gap-*) combined with custom max-width constraints.