Skip to content
Toolbox

Color Converter — HEX, RGB, HSL

Convert colours between HEX, RGB, HSL, HSV, CMYK and OKLCH with a live picker and copy-ready values in every format.

HEX, rgb(), hsl() or a CSS colour name.

  • HEX#4f46e5
  • RGBrgb(79, 70, 229)
  • HSLhsl(243.4, 75.4%, 58.6%)
  • HSVhsv(243.4, 69.4%, 89.8%)
  • CMYKcmyk(66%, 69%, 0%, 10%)
  • OKLCHoklch(51.1% 0.2301 277)

Contrast

WCAG needs 4.5:1 for body text and 3:1 for large text.

  • Sample text6.29:1AA
  • Sample text3.34:1AA Large

About Color Converter

Enter a colour in any common notation and get every other format at once. Useful when a brand guide specifies CMYK, your CSS needs HEX, and your design tokens are written in OKLCH. Values update live as you drag the picker.

How to use it

  1. Type a colour in any format, or use the picker.
  2. Read the converted values in every other notation.
  3. Click any value to copy it.

Frequently asked questions

What is OKLCH and why does it matter?

A perceptually uniform colour space. Equal numeric steps look like equal visual steps, which makes it far better than HSL for generating consistent tints, shades and accessible palettes.

Why does my CMYK conversion look different in print?

CMYK is device-dependent. The values here use a standard approximation; an accurate conversion needs your printer's ICC colour profile.

What does the alpha channel do?

It sets opacity from 0 to 1. In HEX it becomes a fourth pair of digits (#RRGGBBAA); in CSS you can also use rgb() and hsl() with a slash before the alpha.

In-depth reads that go beyond the calculator.