Color converter
Convert colors between HEX, RGB and HSL and check their contrast.
Processed on your device
- How it works
- 1Type a color in any format or use the picker.
- 2Copy the value in the format you need.
Loading tool…
About Color converter
Convert colors between HEX, RGB and HSL by typing them in any format or using the picker. It shows a range of shades of the same color and its contrast with white and black text according to the WCAG accessibility guidelines.
Example: type #4F5BFF to get its RGB and HSL equivalents to paste into your CSS. Before using it as a button background, check the contrast: if white text does not reach 4.5:1, pick a darker shade from the range.
Frequently asked questions
How much contrast does text need?
At least 4.5:1 is recommended for normal text and 3:1 for large text.
Which format should I use in CSS?
All are valid. HEX is the most common; HSL makes it easy to create lighter or darker variants.