HSL to RGB Converter

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

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

What is an HSL to RGB converter?

An HSL to RGB converter turns hue, saturation, and lightness values into red, green, and blue. HSL describes a color the way people tend to think about it: a hue angle on the color wheel (0–360°), a saturation percentage, and a lightness percentage. RGB describes the same color as a mix of three light channels from 0 to 255, which is the format most graphics tools, canvases, and older CSS expect. Converting from HSL to RGB lets you design with intuitive hue and lightness controls and still ship the exact channel values your code needs.

How to convert HSL to RGB

The hue picks a base color on the wheel, saturation controls how vivid it is, and lightness controls how light or dark it is. The converter maps the hue into one of six 60° segments, mixes the channels using chroma derived from saturation and lightness, and then shifts everything so the result lands in the 0–255 range. For example, hsl(243, 75%, 59%) becomes rgb(80, 72, 229). If you include an alpha value between 0 and 1, it is preserved as an rgba() value.

  1. Type or paste HSL values into the HSL field (hsl(...), hsla(...), or plain numbers all work).
  2. Read the RGB code and, when you add alpha, the RGBA 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 HSL to RGB converter?

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

Frequently asked questions

How do I convert an HSL color to RGB?

Use the hue to choose a base color on the wheel, then derive chroma from the saturation and lightness, mix the red, green, and blue channels for that hue, and shift them into the 0–255 range. For example hsl(243, 75%, 59%) becomes rgb(80, 72, 229). This tool does the math automatically.

What HSL formats does it accept?

You can paste hsl(243, 75%, 59%), hsla(243, 75%, 59%, 0.5), or just plain numbers like 243, 75%, 59%. The percent signs are optional, and spaces, commas, and slashes between values all work.

Can it convert HSLA with transparency to RGB?

Yes. When you include an alpha value between 0 and 1, the result also shows an rgba() value where the last number is the alpha channel, such as rgba(80, 72, 229, 0.5).

What is the difference between HSL and RGB?

They describe the same color in different ways. HSL uses a hue angle, a saturation percentage, and a lightness percentage, while RGB mixes three light channels from 0 to 255. HSL is often easier to adjust by hand, but RGB is what most rendering code and image formats use under the hood. Modern browsers and CSS accept both.