RGB ↔ HSL Converter
Convert three RGB values to HSL, or three HSL values to RGB, in either direction.
Not sure? Turn your internet off and try — it still works.
How it works
RGB describes a color by how much red, green, and blue it has (0 to 255 each). HSL describes the same color in a way that's more intuitive for visual tweaks: hue (the color itself, 0 to 360°), saturation (intensity, 0 to 100%), and lightness (how light or dark, 0 to 100%). Why use HSL in CSS: to make a lighter shade of a color, you just raise the lightness, with no need to recalculate three channels. Example: rgb(59, 130, 246) is hsl(217, 91%, 60%); raising L to 80% gives a much lighter blue with the same hue. At the extremes, hue and saturation stop mattering: with L = 0% the result is always black, and with L = 100%, always white. And with S = 0% you get a gray, whatever the H.