Color Converter
The same colour is written differently depending on where it is going: HEX in a stylesheet, RGB in a design tool or a canvas call, HSL when you want to adjust lightness or saturation directly. Converting between them by hand is error-prone.
Enter a colour in any of the three notations and see the equivalents alongside a live swatch.
Runs in your browser. Color Converter processes your input on your own device. Nothing you enter or upload is sent to a server.
How to use the Color Converter
- Enter a colour as HEX, RGB or HSL.
- Read the equivalent values in the other formats.
- Copy the notation you need.
Frequently asked questions
When is HSL more useful than HEX?
When you are adjusting a colour rather than specifying one. HSL separates hue from saturation and lightness, so building a lighter or more muted variant is a single-number change — something that is not obvious at all in HEX.
What does a shorthand HEX code mean?
A three-digit code is expanded by doubling each digit, so #f0c is identical to #ff00cc. It is only usable when each channel happens to have two matching digits.
Is the conversion done locally?
Yes. It runs in your browser.