HEX to HSL converter
Type a HEX code to get HSL, plus every other code, the nearest RAL and Pantone, and the closest paint.
HEX code
HSL 18°, 75%, 47%
All codes
- HEX
- #D4551E
- RGB
- 212, 85, 30
- CMYK
- 0%, 60%, 86%, 17%
- HSV
- 18°, 86%, 83%
- LAB
- 52.5, 47.6, 54.0
- Nearest RAL
- 2009 Traffic Orange
- Nearest Pantone
- 1665C
- Closest paint
- Hempel 57100, Hempel
How HEX becomes HSL
- Divide each channel by 255: R 0.83, G 0.33, B 0.12.
- Lightness is the average of the largest and smallest channel: 47%.
- Saturation and hue follow from the spread between them: hue 18°, saturation 75%.
HSL is another way to write the same RGB color, so this conversion is exact, up to rounding.
Common colors
| Color | HEX | HSL |
|---|---|---|
| RAL 9010 | #F0EDE1 | 48°, 33%, 91% |
| RAL 9016 | #F0F1EA | 69°, 20%, 93% |
| RAL 9005 | #0E0E10 | 240°, 7%, 6% |
| RAL 7016 | #383E42 | 204°, 8%, 24% |
| RAL 7035 | #C5C7C4 | 100°, 3%, 77% |
| RAL 3020 | #B81D13 | 4°, 81%, 40% |
| RAL 5015 | #0B7BB0 | 199°, 88%, 37% |
| RAL 6018 | #599A39 | 100°, 46%, 41% |
| RAL 1023 | #EFB700 | 46°, 100%, 47% |
| RAL 2004 | #DE5306 | 21°, 95%, 45% |
When you need HEX to HSL
HSL describes a color as hue, saturation and lightness, which makes it easy to make a color lighter, darker or less saturated by changing one number. CSS accepts it directly with hsl().
Questions
Is HEX to HSL exact?
Yes. HSL is another way to write the same sRGB color; rounding to whole degrees and percents changes it by less than one RGB unit.
What is the difference between HSL and HSV?
Both use hue and saturation. HSL's lightness puts pure colors at 50%; HSV's value puts them at 100%, as many color pickers do.