Skip to content

Color Converter & Contrast

Convert colours between HEX, RGB, HSL and OKLCH, check WCAG contrast ratios, and test a whole palette with a contrast matrix.

No uploads Embed this tool on your site →
HEX#FF5A1F
RGBrgb(255, 90, 31)
HSLhsl(16 100% 56%)
OKLCHoklch(68.2% 0.211 37.7)
Tailwindbg-[#ff5a1f]

Contrast checker

Background #ffffff

Large heading

Normal body text looks like this on the background.

3.12:1

✕ AA normal text
✓ AA large text
✕ AAA normal text
✕ AAA large text

Palette contrast matrix

Paste a whole palette to check every text/background pair against WCAG 2.2.

0 of 0 pairs pass

How to use Color Converter & Contrast

  1. 1Open Color Converter & Contrast. It runs in your browser, no sign-up.
  2. 2Type or paste your input.
  3. 3Copy or download the result.

Questions

What contrast do I need?

WCAG AA requires 4.5:1 for normal text and 3:1 for large text (18pt+ or 14pt bold).

What is OKLCH?

A perceptual colour space used in modern CSS. Equal steps in lightness look equal to the eye.

More tools

JSON Formatter & ValidatorPretty-print, minify, validate Base64 Encoder & DecoderText and files Hash GeneratorMD5, SHA-1, SHA-256, SHA-512 Password & UUID GeneratorStrong, random, local Regex TesterLive matches and groups JWT DecoderHeader, payload, expiry Diff CheckerCompare two texts CSV ↔ JSON ↔ YAML ↔ XMLConvert data formats