justyourpaletteRGB to HSL
Turn RGB values into hue, saturation and lightness.
- 100% Free
- No Sign Up
- Works in Your Browser
RGB to HSL
Convert RGB values to HSL
More Color Tools
View all tools- Color converterConvert any color between hex, RGB, HSL, CMYK and more
- Hex to RGBConvert hex color codes to RGB values
- RGB to hexConvert RGB values to a hex color code
- Hex to HSLConvert hex color codes to HSL values
- HSL to hexConvert HSL values to a hex color code
- Palette generatorGenerate color palettes and lock the ones you like
- Color pickerPick a color and copy it as hex, RGB or HSL
- Contrast checkerCheck text and background contrast against WCAG
- Palette from imageExtract a color palette from any photo
Every everyday color tool, right in your browser.
No software. No uploads. No signup.
Browse all 28 tools- Color tools
- 28
- Named colors
- 139
- Curated palettes
- 216
How to use the rGB to HSL
Three steps, all in your browser.
- 1
Enter a color
Type or paste a code in any format, or use the picker.
- 2
See every format
The converted values update as you type, in every format at once.
- 3
Copy the codes
Copy any color code in one click, or share the page link.
RGB to HSL: what to know
RGB to HSL converts red, green and blue values into hue, saturation and lightness. The tool scales each channel to between 0 and 1, takes lightness as the average of the largest and smallest channel, works out saturation from their difference and finds hue from which channel is strongest.
Seeing a color as HSL makes its character obvious: the hue tells you which color family it belongs to, saturation tells you whether it's vivid or gray, and lightness tells you how close it is to black or white. That's useful for organizing colors, building themes and explaining color choices.
Equal red, green and blue values are grays, which have 0% saturation; their hue is shown as 0 by convention.
Popular uses
- Turning RGB from code or a sensor into editable HSL
- Sorting a set of colors by hue
- Making lighter and darker variants of an RGB color
- Understanding the vividness and lightness of a color
Tips for the best result
- Paste rgb() straight from CSS; commas or spaces both work.
- Compare saturation values to check whether a set of colors feels consistent.
- For perceptually even lightness, look at the OKLCH value in the color converter too.
Read how JustYourPalette works, browse named colors and curated palettes, and see our privacy details. Colors you enter and images you open are processed in your browser and are never sent to our server.