HSL Color Lab
Visual HSL color picker with tints and saturations.
#2680d9
hsl(210, 70%, 50%)
HSL gives you intuitive control: hue (color), saturation (vivid vs gray), lightness (dark vs light). For UI design, picking a hue once and varying lightness/saturation produces consistent palettes.
About
Drag hue, saturation, lightness sliders. See the color in a big swatch. Bonus rows show how the color changes across lightness and saturation - click any swatch to jump to that value.
How to use
- Move the H, S, L sliders.
FAQ
Why HSL over RGB for design?+
Hue is intuitive (it's the color), lightness is intuitive (dark vs light). Locking hue and varying lightness produces consistent palettes - much harder to do with raw RGB.