Color Converter
Pick a colour or type a hex code, and get the same colour in HEX, RGB and HSL — with a live swatch so you can see exactly what you have.
How to convert a colour between HEX, RGB and HSL
- Pick a colour with the picker, or type a hex code like #1d4ed8.
- Read the same colour as HEX, RGB and HSL below.
- Copy whichever format your CSS or design tool needs.
Frequently asked questions
What's the difference between HEX, RGB and HSL?
They describe the same colour differently. HEX and RGB state the red/green/blue amounts (hex just writes them in base-16). HSL states hue (position on the colour wheel), saturation and lightness — usually the easiest to adjust by hand.
Does it accept 3-digit hex codes?
Yes — shorthand like #fa0 expands to #ffaa00, exactly as CSS treats it.
Why HSL for tweaking colours?
Making a colour lighter, darker or less saturated is a single-number change in HSL, while in RGB all three channels shift together. Designers often think in HSL and ship in HEX.