HEX, RGB and HSL explained
Colours can be written in several ways, and different tools expect different formats. This converter moves between the three most common ones.
The formats
- HEX like #38bdf8, a compact code used in HTML and CSS.
- RGB like rgb(56, 189, 248), three values from 0 to 255.
- HSL like hsl(198, 93%, 60%), hue, saturation and lightness.
Why HSL is useful
HSL is easier to reason about by hand. To make a colour lighter, raise the lightness. To make it more muted, lower the saturation. That is harder to do with HEX or RGB values.
Frequently asked questions
How do I convert hex to RGB?
Enter the hex code and the RGB values appear instantly.
What is HSL used for?
HSL describes a colour by hue, saturation and lightness, which makes it easy to create lighter or darker shades.
Can I preview the colour?
Yes, the swatch shows the colour and the picker lets you choose a new one.