Guide

HEX, RGB, and HSL explained

Three ways to write the same color — here is what HEX, RGB, and HSL mean, and when each is the right choice.

HEX

A six-digit base-16 code like #739CDF — two digits each for red, green, and blue. It’s compact and the most common format in CSS and design tools.

RGB

The same three channels written as numbers from 0–255, e.g. rgb(115, 156, 223). Use rgba() when you need transparency.

HSL

Describes color as hue (0–360°), saturation (%), and lightness (%). It’s the most intuitive for adjusting shades — change lightness to lighten or darken.

Which to use

HEX for handoff and CSS, RGBA for transparency, HSL for programmatic tweaks and building scales. Convert instantly with the color converter.

Frequently asked questions

Is HEX or RGB better?

Neither — they describe the same color. HEX is more compact; RGB(A) is handy when you need an alpha channel.

Why use HSL?

HSL makes lightening, darkening, and desaturating a color simple by changing a single value — ideal for shade ramps and dark mode.