Color Converter
Convert a color between HEX, RGB, HSL and OKLCH.
HEX
#4f46e5
RGB
rgb(79, 70, 229)
HSL
hsl(243, 75%, 59%)
OKLCH
oklch(51.1% 0.230 277.0)
About Color Converter
Pick or type a color and instantly see it in HEX, RGB, HSL, and OKLCH: the newer, perceptually uniform color space increasingly used in modern CSS.
How to use it
- Use the color swatch to pick a color, or type a HEX value directly.
- View the equivalent RGB, HSL, and OKLCH values below.
- Click the copy icon next to any format to copy it.
Common use cases
- Translating a designer's HEX value into a CSS custom property
- Converting a brand color into OKLCH for modern CSS color functions
- Quickly checking a color's RGB or HSL components
FAQ
Why does this include OKLCH alongside HEX/RGB/HSL?
OKLCH is a perceptually uniform color space supported by the oklch() CSS function; it produces more predictable results when mixing, lightening, or theming colors than HSL does.
Can I convert HEX directly to HSL or RGB?
Yes — enter a color in any supported format and the HEX, RGB, HSL, and OKLCH equivalents are all shown together, updating live.