About the HSL to RGB Converter
This converter changes a colour from HSL to RGB. You type the HSL value into three number boxes for hue, saturation and lightness, and the RGB value appears at once, together with a swatch so you can see the colour. The hue picks a point on the colour wheel, saturation says how far the colour is from grey and lightness how close it is to black or white. These are combined to give red, green and blue from 0 to 255. Out-of-range values are explained instead of being silently changed. The result can be copied with one tap. Everything is calculated in your browser, so nothing you type is uploaded.
Updated October 2026
How to use the HSL to RGB Converter
- 1Enter the HSL value in the boxes.
- 2Watch the colour swatch change.
- 3Read the RGB value in the large result box.
- 4Check the second line for the matching value in another notation.
- 5Press Copy result to keep it.
Why convert HSL to RGB
HSL values are convenient to write and tweak in CSS, but images, canvas drawing, game engines and many APIs want RGB numbers. Converting gives you values you can use straight away, and the swatch shows the colour you described.
The same colour can be written in several notations, and each tool or file format prefers one. Having a quick converter means you do not have to guess or repeat the sum by hand when you move a colour from one place to another.
How the HSL to RGB conversion works
The hue picks a point on the colour wheel, saturation says how far the colour is from grey and lightness how close it is to black or white. These are combined to give red, green and blue from 0 to 255.
For hsl(32, 100%, 50%) the colour is a fully saturated orange at mid lightness, which comes out as rgb(255, 136, 0).
- Hue goes from 0 to 360 degrees.
- Saturation and lightness go from 0 to 100 percent.
- Lightness 50 gives the purest colour.
Limits and good habits
Values outside the allowed range, such as an RGB channel above 255 or a percentage above 100, are rejected with a message. Round-trip conversions can drift by one unit because of rounding. If you need a colour to match exactly in print, use the profile supplied by your printer.
The Color Converter on this site shows HEX, RGB, HSL, HSV and CMYK together for one colour, and the Color Contrast Checker tells you whether two colours are readable together.
Phone and computer
On a phone, tap each box and type; the swatch and the RGB value update as you go. On a computer the boxes sit on the left and the result on the right. The page works the same on both, and the Copy button gives you the value to paste into your design tool or style sheet. For the reverse use RGB to HSL Converter, and for a smooth fade use the CSS Gradient Generator.
Features
- HSL to RGB as you type
- Colour swatch
- Clear messages for values out of range
- Copy the result
- Private: nothing is uploaded
- Works on phone and computer
Frequently asked questions
How do I convert HSL to RGB?
The hue picks a point on the colour wheel, saturation says how far the colour is from grey and lightness how close it is to black or white. These are combined to give red, green and blue from 0 to 255. For hsl(32, 100%, 50%) the colour is a fully saturated orange at mid lightness, which comes out as rgb(255, 136, 0).
What is the HSL to RGB formula?
The hue picks a point on the colour wheel, saturation says how far the colour is from grey and lightness how close it is to black or white. These are combined to give red, green and blue from 0 to 255.
What is hsl(32, 100%, 50%) as RGB?
rgb(255, 136, 0). For hsl(32, 100%, 50%) the colour is a fully saturated orange at mid lightness, which comes out as rgb(255, 136, 0).
Are the HSL to RGB results exact?
The calculation is exact, but the values are rounded to whole numbers or whole percentages for display, so converting back and forth can differ by one unit.
Why does the colour look different on my screen and on paper?
Screens emit light and paper reflects it, and every screen and printer has its own profile. The converter gives the standard mathematical values; for print jobs, check a printed proof.
Is my input uploaded?
No. The conversion is done in your browser, and nothing is sent to a server.