Tool
What the HSL to RGB Converter does
HSL to RGB Converter: converts RGB from Hue, Saturation % and Lightness %. Example: hue 217, saturation % 83 and lightness % 53 gives RGB rgb(36, 112, 235).
From Hue, Saturation % and Lightness %, this tool derives RGB. The result recalculates on every keystroke without a button press or a page reload.
It is mostly used by anyone checking a colour for legibility. Contrast failures are the most common accessibility problem on the web, and the easiest to fix.
Everything happens inside this page. Nothing you type is sent to a server, and there is nothing for us to store.
The method, a field-by-field reference and a worked example built from the defaults are all on this page.
What do the HSL to RGB Converter fields mean?
The HSL to RGB Converter uses 3 inputs. The form opens pre-filled, so the fastest way in is usually to overwrite the one field you actually care about.
| Field | What to enter | Default |
|---|---|---|
| Hue | accepts 0 to 360 | 217 |
| Saturation % | accepts 0 to 100 | 83 |
| Lightness % | accepts 0 to 100 | 53 |
How does the HSL to RGB Converter work?
Each output is derived from the inputs above in a single pass; there is no hidden state carried between runs, so the same inputs always give the same conversion.
Nothing is computed until the inputs pass their checks, so you will not get a confident answer built on a typo.
Worked example
These are the values the HSL to RGB Converter loads by default, and the result it produces from them. These are the tool’s own default values and the result they produce, not an invented illustration.
| Hue | 217 |
|---|---|
| Saturation % | 83 |
| Lightness % | 53 |
| RGB | rgb(36, 112, 235) |
|---|
How to use it
- Fill in Hue (0 to 360).
- Type Saturation % (0 to 100).
- Enter Lightness % (0 to 100).
- Live output means you can search for a target value by nudging an input up and down.
- The panel reports RGB.
- Both Copy Link and Print capture the current state, so pick whichever suits how you file things.
What this tool does not do
- Conversions between colour spaces with different gamuts are approximate at the edges.
- Colours render differently across displays; the values are exact but the appearance is not guaranteed.
- Assumptions built into the method are stated above, but they are still assumptions.
- Confirm the units before you act on the output. The arithmetic is only as sound as what went in.
Frequently asked questions
Just Hue, Saturation % and Lightness %. A starting value is in place for each, which makes it easy to isolate the effect of a single variable.
Hue accepts 0 to 360. If a value falls outside, the tool says which field is at fault instead of guessing.
With the values loaded when the page opens, RGB comes out as rgb(36, 112, 235). It recalculates the moment an input changes, which makes comparing scenarios quick.
No record is kept. We never receive what you type, so there is nothing on our side to retain.
It costs nothing, and there is no limit on repeat use.
The output is deterministic. The same inputs always give the same answer, and the method is documented above so you can check it.