Friendly Toolkit
MenuClose

Color Converter

Convert and check colours

Convert colours between HEX, RGB and HSL, and check text contrast against WCAG.

Free, private, no sign-up

Was this tool helpful?

How to convert a colour

  1. Type a colour in any CSS format (#4c3bcf, rgb(76, 59, 207), hsl(247, 61%, 52%)) or a name like teal, or use the colour picker.
  2. Copy it as HEX, RGB or HSL.

Checking contrast

Switch to Check contrast and enter a text colour and a background colour. You'll see the WCAG contrast ratio and whether it passes AA and AAA for normal and large text, with a live preview.

Good to know

What contrast ratio do I need?

WCAG AA asks for at least 4.5:1 for normal text and 3:1 for large text (about 24 px, or 19 px bold). AAA asks for 7:1 and 4.5:1.

What about transparent colours?

Transparent text is blended over the background first, so the ratio matches what people actually see.

Are newer formats like oklch supported?

Not yet. HEX, RGB, HSL and the 148 CSS colour names are supported.