HEX to OKLCH Converter

OKLCH is a newer CSS color space that's perceptually uniform: equal numerical changes in lightness, chroma, or hue feel like equal visual changes. HEX is sRGB-based and not perceptually uniform.

How HEX → OKLCH works

HEX → sRGB → linear RGB → Oklab (via 3×3 matrix) → OKLCH (Oklab in polar form). The result is L (0–100%), C (chroma), H (hue 0–360°).

When to use OKLCH

Use OKLCH when designing modern color systems — accessible palettes, smooth gradients, and dark-mode pairs all benefit from a perceptually uniform space.

Common HEX → OKLCH examples

Tap any swatch to see its full breakdown.

Navy

#000080

→ oklch(27.1% 0.188 264)

Royal Blue

#4169E1

→ oklch(56% 0.188 266)

Sky Blue

#87CEEB

→ oklch(81.5% 0.082 226)

Baby Blue

#89CFF0

→ oklch(82% 0.084 229)

Powder Blue

#B0E0E6

→ oklch(87.5% 0.05 206)

Cornflower Blue

#6495ED

→ oklch(67.5% 0.141 261)

Steel Blue

#4682B4

→ oklch(58.8% 0.099 246)

Dodger Blue

#1E90FF

→ oklch(65.2% 0.19 253)

Cerulean

#007BA7

→ oklch(54.8% 0.112 232)

Teal Blue

#008080

→ oklch(54.3% 0.093 195)

Cyan

#00FFFF

→ oklch(90.5% 0.155 195)

Cobalt Blue

#0047AB

→ oklch(42.8% 0.172 260)

Azure

#007FFF

→ oklch(61.3% 0.212 256)

Sapphire

#0F52BA

→ oklch(46.7% 0.176 260)

Midnight Blue

#191970

→ oklch(28.8% 0.144 273)

Indigo

#4B0082

→ oklch(33.9% 0.179 302)

Periwinkle

#CCCCFF

→ oklch(86.2% 0.07 285)

Slate Blue

#6A5ACD

→ oklch(54.4% 0.171 286)

Other color conversions

HEX → RGB RGB → HEX HEX → HSL OKLCH → HEX RGB → HSL HSL → RGB RGB → OKLCH

Convert any HEX on your Mac

Colorframe shows you HEX, OKLCH, and every other format side-by-side as you pick. Copy any with one click.

Download for Mac