color-systemlisted

# Color System Build a palette whose roles survive text, controls, themes, and gamut limits. OKLCH makes lightness/chroma easier to reason about than HSL/hex, but does not choose art direction or guarantee contrast; the rendered pair is the test. ## Why OKLCH `oklch(L C H)`: **L** 0–1 perceptual lightness, **C** chroma (0 = gray, ~0.37 max real), **H** 0–360 hue. Similar L values start even ramps, but hue/chroma still need inspection. Adjust one property without wrecking the others. It is P3-ready and degrades to sRGB; provide a hex fallback for very old targets. ## The method 1. **Choose structure from evidence.** A restrained product may need one hue/neutrals; data or editorial systems may need several. Record each hue's job. 2. **Build a fixed-step lightness ramp:** 10–12 stops from ~0.97 (50) to ~0.30 (900). Keep H constant; vary L; let C peak mid-range and taper at extremes. 3. **Choose neutral temperature deliberately.** Brand tinting can create cohesion; true neutrals can suit data, photography, or strict status colors. 4. **Pick semantic colors** (success/error/warning/info) at matched L/C; avoid random stock red/green. 5. **Derive interaction states** (hover/active) by nudging L ±0.04–0.06, not opacity. 6. **Verify contrast** for every text/bg pair you'll actually use. ## Derive from the brief, not this file The sample shows ramp mechanics, not a palette menu. Start from brand evidence, audience, ambient light, and roles; state why hue, neutral tem