Color Converter (HEX, RGB, HSL)

Type a color in any common format, or pick one, and get it in HEX, RGB and HSL at once. The tool also checks how readable white and black text would be on top of that color.

HEX
RGB
HSL
Contrast with white text
Contrast with black text

Runs entirely in your browser. Nothing you enter is sent to a server.

How to use it

  1. Type a HEX, RGB or HSL value, or use the color picker.
  2. Check the preview and the converted values.
  3. Press Copy next to the format you need.
  4. Look at the contrast lines to choose between white and black text.

Accepted formats

  • HEX: #3366CC or the short form #36C, with or without the #.
  • RGB: rgb(51, 102, 204), or just 51 102 204.
  • HSL: hsl(220, 60%, 50%), with the hue in degrees and the saturation and lightness in percent.

Frequently asked questions

What is the difference between HEX and RGB?
They describe the same color. RGB writes the red, green and blue amounts as numbers from 0 to 255, and HEX writes the same three numbers in base 16.
Why use HSL?
HSL describes a color by hue, saturation and lightness, which is easier to adjust by hand. To make a color lighter, raise the lightness and keep the hue.
What does the contrast ratio mean?
It follows the WCAG accessibility guidelines. Normal text needs at least 4.5:1 to pass level AA, and large text needs 3:1. The tool reports the 4.5:1 test.
Are the converted values exact?
HEX and RGB are exact. HSL values are rounded to whole numbers, so converting back may differ by one unit.

More tools