Converting RGB to HSL
RGB describes a color as amounts of red, green, and blue light from 0 to 255 — the native model of every screen and camera. HSL expresses a color as a hue angle plus saturation and lightness percentages, which maps closely to how people think about color.
RGB and HSL both describe on-screen color, so the conversion is exact and lossless. RGB is handy for digital screens, programming, and CSS rgb() values, while HSL is better for designing palettes and tweaking colors intuitively in CSS.
This RGB to HSL converter works instantly in your browser: type or pick a RGB color and the HSL value updates live, along with every other common format so you can copy whichever you need. Nothing is sent to a server, and it is completely free with no limits.
When do you need HSL?
Reach for HSL when you are working on designing palettes and tweaking colors intuitively in CSS. Designers and developers routinely convert RGB to HSL to move a color between a web workflow and a design one without eyeballing it. If you want to grab a color straight from an image instead of typing it, try our color picker from image, or build a full scheme with the palette generator.
You can also convert in the other direction with our HSL to RGB converter, or jump to any other format — the tool always shows HEX, RGB, HSL, HSV, and CMYK side by side.