Color
The part of design everyone fears, defanged. Why palettes are ramps rather than five hex codes, the color model that makes shade-building predictable, and how many colors real products actually need.
01 Why Color Is a System, Not a PickerFree preview The taste component is one decision — the rest is mechanics, and mechanics are learnable. 02 Choosing the HueFree preview The one real taste decision — pick the hue for the personality it signals, set chroma for how loud it is. 03 Meet OKLCH Three understandable dials instead of a hex blob — and lightness that finally tells the truth. 04 You Need More Colors Than You Think 8–10 grays, a primary ramp, and small ramps per meaning — fifty-plus values, all picked once. 05 From One Accent to a Full Palette Convert the accent to OKLCH, set the edges by their real jobs, and fill the gaps — ten minutes, one color, a complete ramp. 06 Grays Don't Have to Be Gray A whisper of chroma sets the temperature — cool and technical, or warm and editorial. Pick one and commit. 07 Perceived Brightness Blues sink, yellows shout — why equal numbers aren't equal colors, and the one-number fix. 08 Using Accent Color Sparingly Color is attention — spend it deliberately, and each use says more. 09 Accessible Doesn't Mean Ugly The 4.5:1 floor is firm, not stylistic — and meeting it makes most designs better, not blander. 10 Gradients Interpolate in oklch to kill the muddy middle, ease fade-to-dark overlays, and let most gradients whisper. 11 Dark Mode Re-light, don't invert — near-black backgrounds, off-white text, lightness as elevation, accents eased down. 12 Building a Reusable Color System (+ AI Prompt) Tinted grays, a primary from the brand hue, semantic trios, a matched categorical set — wired into role tokens.