RGB to HSL Converter

Convert RGB and RGBA color values to HSL color codes instantly in your browser.

Convert any RGB or RGBA color to an HSL code instantly with this free online RGB to HSL converter. Type values such as rgb(79, 70, 229) (or just 79, 70, 229), or pick a color with the swatch, and get the matching hsl(243, 75%, 59%) right away. It accepts plain comma-separated numbers, rgb() and rgba() strings, and an optional alpha channel that becomes an hsla() value — and everything runs in your browser with nothing to install.

What is an RGB to HSL converter?

An RGB to HSL converter turns red, green, and blue color values into hue, saturation, and lightness. RGB describes a color as a mix of three light channels from 0 to 255, while HSL describes it the way people tend to think about color: a hue angle on the color wheel (0–360°), a saturation percentage, and a lightness percentage. HSL makes it intuitive to lighten, darken, or desaturate a color, which is why designers reach for it in CSS.

How to convert RGB to HSL

First each RGB channel is divided by 255 to get a value between 0 and 1. Lightness is the average of the largest and smallest of those values. Saturation comes from how far apart they are, scaled by lightness. Hue is the angle pointing toward the dominant channel on the color wheel. For example, rgb(79, 70, 229) becomes hsl(243, 75%, 59%). If you include an alpha value between 0 and 1, it is preserved as an hsla() value.

  1. Type or paste RGB values into the RGB field (rgb(...), rgba(...), or plain numbers all work).
  2. Read the HSL code and, when you add alpha, the HSLA value, updated as you type.
  3. Use the color picker if you would rather choose a color visually.
  4. Click Copy to copy the format you need.

Why use this RGB to HSL converter?

  • 100% free with no ads, sign-up, or limits.
  • Instant conversion as you type.
  • Accepts rgb(), rgba(), and plain comma-separated numbers.
  • Outputs ready-to-use hsl(), plus hsla() when you include alpha.
  • Runs entirely in your browser — your colors never leave your device.

Frequently asked questions

How do I convert an RGB color to HSL?

Scale each RGB channel to the 0–1 range, then compute lightness as the midpoint of the brightest and darkest channels, saturation from the spread between them, and hue as the angle of the dominant channel on the color wheel. For example rgb(79, 70, 229) becomes hsl(243, 75%, 59%). This tool does the math automatically.

What RGB formats does it accept?

You can paste rgb(79, 70, 229), rgba(79, 70, 229, 0.5), or just plain numbers like 79, 70, 229. Spaces, commas, and slashes between values all work.

Can it convert RGBA with transparency to HSL?

Yes. When you include an alpha value between 0 and 1, the result also shows an hsla() value where the last number is the alpha channel, such as hsla(243, 75%, 59%, 0.5).

What is the difference between RGB and HSL?

They describe the same color in different ways. RGB mixes three light channels from 0 to 255, while HSL uses a hue angle, a saturation percentage, and a lightness percentage. HSL is often easier to adjust by hand because changing lightness or saturation keeps the same hue. Modern browsers and CSS accept both.