Color Converter

HEX, RGB, HSL and OKLCH — all directions.

Which format, when

HEX is the design-tool lingua franca — compact and universal. RGB makes alpha explicit with rgba(). HSL is the human-editable one: to make a palette you rotate the hue and adjust lightness while hue stays stable — far easier than nudging RGB channels blindly. OKLCH is the modern perceptual format: equal numeric steps look like equal visual steps, so gradients and palette ramps built in OKLCH don't develop muddy midpoints the way RGB-based ones do.

All modern browsers support OKLCH, and it's quickly becoming the design-system default for exactly this reason. Convert here, then build your ramps in OKLCH with confidence.

FAQ

Why do HEX and OKLCH values look unrelated?

They pass through different color spaces (sRGB vs OKLab perceptual). They describe the same displayed color — the numbers are just coordinates in different systems.

Does alpha survive conversion?

This tool converts the color itself; add alpha in CSS as rgb(r g b / 0.5) or oklch(... / 0.5) — the modern slash syntax works in all four formats.