OKLCh to hex
OKLCh can describe colours outside sRGB, so this conversion may need gamut mapping. Chroma is reduced while lightness and hue are held, which looks far better than clipping each channel.
#4287f5Paste a OKLCh value — other formats work too.
Need every format at once? Open in the full picker
Worked examples
Common colours converted from OKLCh to hex, computed with the same engine the picker uses.
| Colour | OKLCh | hex | Copy |
|---|---|---|---|
| Pure red | oklch(62.796% 0.25768 29.234) | #ff0000 | |
| Pure green | oklch(86.644% 0.29483 142.495) | #00ff00 | |
| Pure blue | oklch(45.201% 0.31321 264.052) | #0000ff | |
| White | oklch(100% 0 0) | #ffffff | |
| Mid grey | oklch(59.987% 0 0) | #808080 | |
| Black | oklch(0% 0 0) | #000000 | |
| Interface blue | oklch(63.521% 0.17906 259.418) | #4287f5 | |
| Success green | oklch(72.275% 0.19201 149.579) | #22c55e | |
| Danger red | oklch(63.683% 0.20785 25.331) | #ef4444 | |
| Warning amber | oklch(76.859% 0.16466 70.08) | #f59e0b | |
| Editor black | oklch(23.503% 0 0) | #1e1e1e | |
| Warm sand | oklch(83.419% 0.11701 87.428) | #e9c46a |
How the conversion works
OKLCh can describe colours outside sRGB, so this conversion may need gamut mapping. Chroma is reduced while lightness and hue are held, which looks far better than clipping each channel.
Both formats are computed from a single canonical representation — CIE XYZ with a D65 white point, held in floating point — rather than by chaining one format into the next. That matters because chained conversions accumulate rounding error, and because it means a colour that cannot be represented in the target format is handled deliberately rather than by accident.
When the source describes a colour outside the target's gamut, chroma is reduced in OKLCh while lightness and hue are held, following the CSS Color 4 gamut mapping algorithm. Clipping each channel independently would be simpler but visibly shifts hue on saturated colours.