Color Converter
Convert colours between HEX, RGB, HSL and OKLCH, and check WCAG 2 contrast ratios between a foreground and background colour for accessible design.
Runs locally · nothing uploaded
How to use the Color Converter
- 1
Pick a colour or type it as HEX, RGB or HSL.
- 2
Copy it as HEX, RGB, HSL or OKLCH.
- 3
Set text and background colours to see the WCAG contrast ratio and AA/AAA results.
What happens to your data
Colours are converted in your browser. Nothing is sent anywhere.
Frequently asked questions
What contrast ratio do I need?
WCAG AA needs 4.5:1 for body text and 3:1 for large text. AAA needs 7:1 and 4.5:1.
What is OKLCH?
A perceptual colour space used in modern CSS. Equal steps in lightness look equally different, which makes palettes easier to build.