Foundations
Foundations
The raw materials PRIZM is built from. Each foundation page is a reference — what the tokens are, what they look like, and when to use them.
Design principles
The human factors and HCI research that shapes PRIZM's patterns. Core principles, plus product-specific sets for C3 and Enterprise.
- 4 core principles
- 5 C3-specific
- 4 Enterprise-specific
Colours
Semantic tokens (bg, fg, accent, status) shown across all four theme variants, plus the baseline scales they map onto.
- 18 semantic tokens
- 3 baseline scales
- 4-variant swatches
Typography
Font families (Inter, JetBrains Mono), the full type scale with live samples, and the weights used across PRIZM.
- 2 font families
- 9-step type scale
- 4 weights
Surface & motion
Corner radii, shadow elevation tiers, and notes on motion. The physical-feeling values that make UI feel tactile.
- 5 radii
- 3 shadows
- Tailwind defaults for motion
Icons
lucide-react at PRIZM's site-wide 1.5 stroke-width. Size scale, text-pairing rules, accessibility, and a catalogue of the icons used across the system.
- 1.5 stroke-width
- 5 standard sizes
- ~30 reference icons
Liquid glass
A C3-only surface treatment for floating panels over canvas content. Two tiers (chrome / panel), both light- and dark-mode variants.
- C3-only
- Two tiers
- Light + dark
Need the architecture behind the tokens? Theming explains how the four-variant system is wired and how to activate a theme.