Color Converter (HEX, RGB, HSL)
Convert colors between HEX, RGB and HSL instantly. Pick a color visually or type a code, copy any format and check contrast against white and black.
Runs in your browser. Nothing is uploaded.
Contrast ratio
About this tool
Designers and developers constantly switch between color formats. This color converter translates between HEX codes such as #1c4fd8, RGB values such as rgb(28, 79, 216) and HSL values such as hsl(224, 77%, 48%). Pick a color with the visual picker or type in any of the three boxes, and the other two update immediately.
HEX and RGB describe the amount of red, green and blue light, while HSL describes hue, saturation and lightness, which makes it easier to create lighter, darker or more muted variations of a color. The tool also shows the contrast ratio of your color against white and black, so you can quickly see which text color is readable on it. Everything runs in your browser.
How to use it
- Click the color swatch to open the color picker, or type a code into the HEX, RGB or HSL box.
- The other formats update automatically. Short HEX codes like #fa0 and notations such as “28 79 216” are understood.
- Press “Copy” under the format you need and paste it into your stylesheet or design tool.
- Check the contrast lines to see whether white or black text is easier to read on your color.
Frequently asked questions
How do I convert HEX to RGB?
Type the HEX code in the HEX box. The RGB box shows the matching values straight away. For example, #ff5733 is rgb(255, 87, 51).
What is HSL and why use it?
HSL stands for hue, saturation and lightness. Because lightness is a separate number, you can make a color lighter or darker by changing just one value, which is harder to do with RGB or HEX.
What does the contrast ratio mean?
It measures how different two colors are in brightness. Accessibility guidelines (WCAG) ask for at least 4.5:1 for normal text. The ratio shown is for your color against white and against black.
Why do converted values sometimes differ by one?
HSL values are rounded to whole numbers, so converting back and forth can change an RGB channel by one or two units. The HEX and RGB values are exact.
Related tools
QR Code Generator
Create a QR code for a link or any text. Choose the colors and size, then download it as PNG or SVG. Free, with no sign-up, made right in your browser.
Unit Converter
Convert length, weight, volume, area, speed, temperature and data size between metric and imperial units instantly. Free, accurate and private in your browser.
Image Compressor & Converter
Compress, resize and convert images to JPG, PNG or WebP online. Everything happens in your browser, so your photos are never uploaded. Free, with no limits.