481+ free calculators — no sign-up, no ads, no paywalls. Browse all tools →
Start typing to search...
RGB Color Conversion Studio

RGB to HSL Converter

Convert red, green and blue channel values into hue, saturation and lightness instantly. Use RGB sliders, enter exact values, paste a complete rgb() color or use the visual color picker to generate accurate HSL output.

RGB Sliders
Color Picker
HSL Output
Copy Results
RGB → HSL MIXER LIVE CONVERSION
rgb(135, 80, 215)
Hue 262°
Saturation 63%
Lightness 58%

Convert RGB to HSL

Adjust red, green and blue values from 0 to 255 or paste a complete RGB color. The HSL result updates instantly.

RGB to HSL Converter Interactive color conversion
Instant Conversion
Red Channel
Green Channel
Blue Channel
Choose RGB color visually
Live Color Preview
HSL COLOR
hsl(262, 63%, 58%)
Hue 262°
Saturation 63%
Lightness 58%
HEX #8750D7
RGB 135, 80, 215

Try Popular RGB Colors

Choose a preset RGB color and instantly see its corresponding HSL values.

What Is RGB to HSL Conversion?

RGB and HSL are two different ways to represent digital colors. RGB describes a color using red, green and blue light channels, while HSL describes the same color using hue, saturation and lightness.

How Is RGB Converted to HSL?

The red, green and blue channel values are first normalized from the 0–255 range into decimal values from 0 to 1. The maximum and minimum channels are then compared to determine lightness, saturation and the hue position on the color wheel.

Why Convert RGB to HSL?

HSL can make color adjustments easier to understand. Instead of changing several RGB channels manually, you can adjust hue, color intensity or lightness independently.

RGB → HSL CONVERSION
Input: rgb(135, 80, 215)

Normalize: R / 255, G / 255, B / 255

Find max channel
Find min channel
Calculate delta
Calculate lightness
Calculate saturation
Calculate hue angle

Result: hsl(262, 63%, 58%)

✓ Conversion complete

Why Use This RGB to HSL Converter?

A fast and visual color-conversion tool for developers, designers and anyone working with digital colors.

RGB Sliders

Adjust red, green and blue channels interactively from 0 to 255.

Visual Color Picker

Choose a color visually and automatically load its RGB channel values.

HSL Breakdown

View hue, saturation and lightness individually along with the complete CSS hsl() value.

Live Preview

See the resulting color instantly whenever any RGB channel changes.

Copy HSL Values

Copy the complete HSL result or individual hue, saturation and lightness values.

HEX Reference

See the equivalent HEX code alongside the HSL result for quick cross-format comparison.

How to Convert RGB to HSL

Convert an RGB color into HSL values in three simple steps.

1

Enter RGB Values

Enter red, green and blue channel values between 0 and 255, paste an rgb() color or use the color picker.

2

View HSL Output

The converter calculates hue from 0–360 degrees and saturation and lightness as percentages.

3

Copy the Result

Copy the complete hsl() value or copy the H, S and L components separately.

RGB to HSL Converter FAQs

Common questions about RGB channels, HSL colors and color conversion.

RGB stands for Red, Green and Blue. In common 8-bit RGB colors, each channel has a value between 0 and 255.
HSL stands for Hue, Saturation and Lightness. Hue is usually measured in degrees, while saturation and lightness are expressed as percentages.
You can enter whole RGB channel values from 0 through 255 for red, green and blue.
Yes. You can enter a value such as rgb(59, 130, 246) and convert it directly.
Equal red, green and blue values create a grayscale color. Saturation becomes 0%, so hue has no visible effect and this tool reports hue as 0 degrees.
Yes. The generated hsl() color value can be used directly in CSS properties that accept standard CSS colors.
Yes. The primary conversion output is HSL, and the equivalent six-digit HEX color is shown as an additional reference.
Yes. You can convert RGB colors, use the sliders and color picker, and copy HSL results without registration.