Color Converter & Contrast Checker
Convert any color between HEX, RGB, HSL, HSV, CMYK and more, create shades and tints, and check if your text colors pass WCAG accessibility.
Shades & tints click to use ·
Color harmonies
WCAG contrast checker
Normal body text — the quick brown fox jumps over the lazy dog.
ButtonEverything is calculated in your browser.
How to use the Color Converter & Contrast Checker
Enter or pick a color
Type any format — HEX, rgb(), hsl() or a CSS name.
Get every format
Copy the value you need with one click.
Check contrast
See the WCAG ratio and AA/AAA results.
Why use our Color Converter & Contrast Checker?
8 formats
HEX, HEX8, RGB, HSL, HSV, HWB, CMYK and CSS name.
Smart input
Paste any CSS color, with or without alpha.
WCAG contrast
AA and AAA for normal and large text.
Auto-fix contrast
Finds the closest color that passes AA.
Shades & tints
10 lighter and darker variations.
CSS variables
Copy a ready palette as CSS custom properties.
Frequently asked questions
Everything you need to know about the Color Converter & Contrast Checker.
Back to the toolHow do I convert HEX to RGB?
Split the 6-digit HEX into three pairs and convert each from hexadecimal to decimal. For example #2F6BFF = rgb(47, 107, 255). The tool does it instantly.
What is a good contrast ratio?
WCAG AA requires at least 4.5:1 for normal text and 3:1 for large text. AAA requires 7:1 and 4.5:1.
What is the difference between RGB and CMYK?
RGB is for screens (light), CMYK is for printing (ink). CMYK values here are an approximation without a print color profile.
What is HSL?
HSL stands for hue, saturation and lightness. It makes it easy to create lighter or darker versions of a color.
What is HEX8?
An 8-digit HEX color includes transparency (alpha) as the last two digits, e.g. #2F6BFF80 is 50% transparent.
You may also like
Have a project in mind? Let’s build it together.
Get a free consultation and a fixed-price quote within 24 hours.