Color Converter
Convert between HEX, RGB, HSL and CSS colour formats with a live preview.
Runs entirely in your browser.
Your data never leaves this device and is never sent to our servers.
HEX, rgb(), or hsl() all work.
The same colour has several notations, and each is convenient for something different. HEX is compact and universal. RGB maps to how a screen emits light. HSL is the one to reach for when you want a lighter or more muted version of a colour, because you change one number instead of three.
How to use it
- Type a colour in any supported notation, or use the picker.
- Read every equivalent format.
- Copy the notation you need.
Not working as you expect? Report a problem with this tool.
Frequently asked questions
Which format should I use in CSS?
Any of them work. HEX is most common for fixed values; HSL is far easier to adjust by hand, which is why design systems often define palettes in HSL.
What is relative luminance for?
It is the perceived brightness used in the WCAG contrast formula. If you are checking text legibility, use the Contrast Checker, which does that calculation for you.