What is the difference between HSL and RGB?

RGB (Red, Green, Blue) describes color using three light intensities from 0–255. HSL (Hue, Saturation, Lightness) describes it in a more human-intuitive way: the hue angle, how saturated it is, and how light or dark.

Does it support alpha / opacity?

Currently it converts opaque colors. RGBA and HSLA support is coming.

ToolKits

Color Picker

Pick colors and convert between HEX, RGB, and HSL formats.

Pick a colour

HEX

RGB

rgb(59, 130, 246)

HSL

hsl(217, 91%, 60%)

About the Color Picker

Designers and developers constantly switch between HEX, RGB, and HSL. Our color picker lets you choose any color from a visual picker and instantly see its value in all three formats, ready to copy into your code or design tool.

How to use the Color Picker

Use the color picker to select a color, or type a HEX/RGB/HSL value.
All three format representations update simultaneously.
Click any value to copy it to the clipboard.

Frequently Asked Questions

What is the difference between HSL and RGB?: RGB (Red, Green, Blue) describes color using three light intensities from 0–255. HSL (Hue, Saturation, Lightness) describes it in a more human-intuitive way: the hue angle, how saturated it is, and how light or dark.
Does it support alpha / opacity?: Currently it converts opaque colors. RGBA and HSLA support is coming.