An Advanced Color Picker With OKLCh, LCh, LAB, and Color Harmony

CSS now supports oklch() — a perceptually uniform color space that makes gradients look natural and lets you lighten/darken colors without hue shifts. But most color pickers still only know RGB and HSL. This one supports six color spaces (RGB, HSL, HSV, LAB, LCh, OKLCh) with sliders that stay in sync, plus color harmony generation and contrast checking.

OKLCh is the modern CSS color format you should be using. Lightness is perceptually uniform (step 0.1 L looks like the same perceptual distance everywhere). Chroma is the "intensity" of the color. Hue is an angle. The problem: barely any tools let you dial in OKLCh values directly.

🔗 Live demo: