This tool runs entirely in your browser. Nothing you paste is uploaded.
How you can check →OKLCH to HEX converter
Converts OKLCH to HEX, entirely in your browser, with the same round-trip receipt the full color converter shows.
Converting OKLCH to HEX is the direction where gamut actually matters, because OKLCH can express colors sRGB — and therefore hex — cannot hold at all. oklch(65% 0.35 29), a saturated red-orange, is a real, valid OKLCH color that no 6-digit hex value can represent exactly; every screen showing a hex color is limited to sRGB's smaller gamut. Something has to give, and how a converter handles that is the single biggest correctness difference between tools in this category.
The wrong way, which most online converters take, is per-channel clipping: compute the naive RGB numbers, and clamp any that fall outside 0-255 straight to the boundary. That silently shifts the hue, because clamping one channel independently of the other two changes the ratio between them — the exact thing that defines a color's hue. The correct approach, specified by CSS Color 4 and what this page's engine implements, is to reduce chroma in OKLCH space by binary search while holding lightness and hue fixed, checking each candidate against a perceptual distance metric (ΔEOK) until the result just fits inside sRGB. That keeps the hue intact and only sacrifices saturation, which is a smaller, more honest loss than a color that has visibly changed which color it is.
A worked example, measured directly: oklch(0.65 0.35 29) is out of gamut for sRGB. Naive per-channel clipping of the raw RGB numbers, and this engine's own CSS Color 4 chroma-reduction algorithm, both happen to land on #ff0000 for this particular input — pure red, hue collapsed to the sRGB gamut's own red corner — which is itself worth knowing: gamut mapping doesn't always visibly preserve hue the way it does for less extreme inputs, because the correct in-gamut answer can genuinely sit right at a gamut corner. This page's converter reports both facts explicitly regardless of the outcome: whether your input was in gamut at all, and if not, how much chroma was reduced getting it there.
The reverse direction — HEX to OKLCH — never hits this problem, since every hex value is already inside sRGB by definition; see that page if you're starting from a hex color instead. In this direction, if your OKLCH value is already inside sRGB (most colors intended for screen design are), the conversion is exact and no mapping happens at all — the gamut note only appears when it's actually needed.
Use this conversion when a design tool, Tailwind v4 theme, or CSS file hands you an oklch() value and you need a hex fallback for older browsers, an email client, or any context that doesn't parse modern CSS color syntax — plain hex is still the most universally supported color format there is.
Frequently asked questions
- What happens when my OKLCH color is outside sRGB?
- This tool reduces chroma in OKLCH space by binary search — holding lightness and hue fixed — until the color fits inside sRGB, following the CSS Color 4 algorithm. It never clips RGB channels individually, which is what shifts hue in most other converters. The page tells you when this mapping happened and how much chroma was lost.
- How do I know if my OKLCH color will fit on a normal screen?
- Paste it into the converter — the gamut note shows whether it's inside sRGB, inside the wider Display P3 gamut only, or outside both. Most consumer monitors only display sRGB; many recent phones and Macs support the wider P3 gamut.
- Does gamut mapping always keep the hue visibly unchanged?
- It holds the mathematical hue angle fixed by construction, but for colors far enough outside sRGB the nearest in-gamut match can still land at a gamut corner — like pure red — where hue becomes less meaningful to the eye. For moderately out-of-gamut colors the visual hue shift is far smaller than per-channel clipping produces.