Mr. Encoder

Color Converter

Convert any CSS color to HEX, RGB, HSL, HWB, CMYK and OKLCH and check its WCAG contrast.

How to use

  1. Type or paste a color in any CSS format, or choose one with the color picker.
  2. See it instantly as HEX, RGB, HSL, HWB, CMYK and OKLCH and copy the format you need.
  3. Check the contrast ratio against white and black to make sure your text stays readable.

Frequently asked questions

What contrast ratio does WCAG require?

WCAG 2 level AA requires at least 4.5:1 for normal text and 3:1 for large text (24px, or 18.66px bold). Level AAA requires 7:1 for normal text and 4.5:1 for large text.

What is OKLCH and why use it?

OKLCH is a perceptually uniform color space: equal changes in lightness or chroma look like equal changes to the eye. That makes it great for building color palettes, and modern browsers support it in CSS via oklch().

How are transparent colors handled?

8-digit HEX, rgba() and hsla() keep their alpha value in every format that supports it. For contrast checks the color is first blended over the white or black background.

Is the CMYK value print-accurate?

No. It is the standard mathematical conversion from RGB. Exact print colors depend on the printer, paper and ICC color profile, so use your design software for final print values.

Other tools