RGB To HSL Converter

Convert opaque RGB channels into CSS hsl() notation. Whole RGB channels 0–255.

Free to useNo sign-upRuns in your browser

Enter your details

Enter the inputs, then select Convert.

Your result

Enter your details

Result will appear here

How RGB To HSL Converter works

Convert opaque RGB channels into CSS hsl() notation.

Whole RGB channels 0–255. Hue zero is used for greys; saturation and lightness are percentages, without alpha.

Concept diagram for RGB To HSL Converter, showing red channel input and the supported output. — Concept diagram; the three operation images are actual browser captures.

How to use RGB To HSL Converter

Follow the labelled inputs.

Enter red channel

Replace the example with red channel. The field labels specify the expected format and units.

Convert

Check the remaining inputs

Set green channel, blue channel. Whole RGB channels 0–255.

Convert

Run, review and save

Select Convert. Review the CSS hsl() value, then copy it or download the result text.

Convert

Examples and uses for RGB To HSL Converter

Check the supplied example

The starting example produces hsl(0, 100%, 50%). Convert opaque RGB channels into CSS hsl() notation.

Convert

Abstract input values and a mathematical worksheet. — Start with the values. Concept illustration.

Use your own inputs

Read the labels for red channel and green channel, blue channel. Whole RGB channels 0–255.

Convert

Two calculation examples shown for comparison. — Compare a second example. Concept illustration.

Record a reviewed result

Copy the CSS hsl() value into your working file. Whole RGB channels 0–255.

Convert

A calculation and supporting explanation represented conceptually. — Explain the calculation. Concept illustration.

How to read the result

Read the CSS hsl() value with the input convention.

Convert opaque RGB channels into CSS hsl() notation.

Whole RGB channels 0–255. Hue zero is used for greys; saturation and lightness are percentages, without alpha.

Convert Convert

A mathematical result connected to the values used to calculate it. — Read the result with its inputs. Concept illustration.

Supported input and limits

Check the stated scope before you run it.

Whole RGB channels 0–255. Hue zero is used for greys; saturation and lightness are percentages, without alpha.

The input stays in this browser. Copy result and Download save the same displayed text.

Convert Convert

Values and units reviewed before relying on a mathematical result. — Check values and units. Concept illustration.

HSL To RGB Converter

Convert hue, saturation and lightness through the standard HSL chroma and sector equations.

Open tool

Hex to RGB Converter

Convert #RGB or #RRGGBB colours into CSS rgb() values and individual red, green, and blue channels.

Open tool

RGB to Hex Converter

Convert RGB channel numbers into a six-digit hexadecimal CSS colour and preview it.

Open tool

More free tools to try

Choose another tool for your next calculation, conversion, or text task.

AVIF To PNG Converter

Decode the selected AVIF image and encode a PNG file at the same pixel dimensions.

Open tool

Add Text To Image Converter

Draw a single line of supplied text onto the bitmap using a browser sans-serif font.

Open tool

Add Watermark To Image Converter

Draw one text watermark at the lower-right corner with the supplied opacity.

Open tool

BMP to JPG Converter

Decode the selected BMP image and encode a JPEG file at the same pixel dimensions.

Open tool

View all free tools

RGB To HSL Converter: common questions

Answers about using RGB To HSL Converter and understanding its results.

What assumptions and input limits apply?

Whole RGB channels 0–255. Hue zero is used for greys; saturation and lightness are percentages, without alpha.

How can I save the output?

Use Copy result to copy the displayed text, or Download to save it as a text file. The tool runs in your browser and does not require an account.

Convert with your input

Check the CSS hsl() value, then copy or download it.

Convert