OKLCH Color Converter

Convert colors between HEX/RGB and the modern OKLCH and OKLAB perceptual color spaces. OKLCH is the future of CSS color.

Input HEX: #3b82f6Lightness (L): 0.623Chroma (C): 0.1880Hue Angle (H): 259.81°

Presets & Samples

Input Color

rgb(59, 130, 246)

OKLCH

Lightness (L)

0.623

0 = black, 1 = white

Chroma (C)

0.1880

0 = grey, higher = vivid

Hue (H)

259.81°

0–360° color wheel

oklch(0.623 0.1880 259.81)

OKLab

Lightness (L)

0.623

Green-Red (a)

-0.0332

Blue-Yellow (b)

-0.1851

oklab(0.623 -0.0332 -0.1851)

CSS Snippets

color: oklch(0.623 0.1880 259.81);

color: oklab(0.623 -0.0332 -0.1851);

background-color: oklch(0.623 0.1880 259.81);

About OKLCH and OKLab

OKLCH and OKLab are perceptually uniform color spaces — meaning equal numerical differences correspond to equal perceived color differences. This makes them ideal for generating accessible color palettes, creating smooth color transitions, and ensuring consistent contrast ratios. OKLCH (Lightness, Chroma, Hue) is especially useful for designers because the parameters are intuitive: L controls brightness, C controls saturation, and H controls the hue angle. Both are natively supported in modern CSS via oklch() and oklab()functions (Chrome 111+, Firefox 113+, Safari 15.4+).

Private & free — this tool runs entirely in your browser.