HEX, RGB and HSL — what’s the difference?
They’re three ways to write the same colour. HEX (#2563eb) is the compact hex code used in CSS and design tools. RGB (rgb(37, 99, 235)) gives the red, green and blue channels from 0–255. HSL (hsl(221, 83%, 53%)) describes hue, saturation and lightness — often the most intuitive for tweaking a colour. This converter turns any one into the others instantly, with a live preview.
Frequently Asked Questions
How do I use it?
Pick a colour with the swatch picker, or type a value into any field (HEX, RGB or HSL) and press Enter — the other formats update automatically.
Which format should I use in CSS?
All three work in CSS. HEX is most common; HSL is great when you want to nudge lightness or saturation; RGB (and rgba) is handy when you need transparency.
Is my data private?
Yes — all conversion happens in your browser with JavaScript. Nothing is uploaded or stored.
Why did my HSL round-trip change by 1?
HSL values are rounded to whole numbers, so converting back can shift a channel by a point. It’s visually identical.
