Free · Pick modern CSS colors

OKLCH Color Picker

Choose lightness, color strength, and hue with simple sliders, then copy a browser-ready OKLCH color.

  • Instant results
  • Private in your browser
  • No signup or limits

Pick an OKLCH color

Lightness is how bright it is. Chroma is how colorful it is. Hue chooses the color family.

#9d65dd
OKLCHoklch(62% 0.18 303)
HEX#9d65dd
P3color(display-p3 0.5838 0.4049 0.8416)

Three simple steps

How to use it

  1. Move Lightness to make the color darker or lighter.
  2. Move Chroma to make it softer or brighter, then choose a hue.
  3. Copy the OKLCH, HEX, or Display P3 value shown below.

Your colors stay on this device

This tool runs in your browser. Bookify does not upload or save your colors or images. Close the tab and the working data is gone.