A hex code from a stylesheet, RGB numbers from a design tool, and HSL values from a colour picker all describe the same colour in different words. This free color converter puts all three in one card: type in any format and the other two update live, next to a swatch so a mistyped value is obvious. It is a combined tool, so everything sits in one place instead of spreading across six single-purpose pages — the single-purpose converters are linked below if you want just one direction. Everything runs in your browser, so your colours are never uploaded and no signup is needed. The honest limits: only opaque colours are supported, so 8-digit hex codes with an alpha channel are rejected, and HSL values are shown to one decimal, so converting back may differ by 1 in a channel.
How to use this color converter
One card, three notations, no page-hopping.
Enter a hex code, RGB numbers, or HSL values — whichever form you already have.
The remaining formats fill in live, with a swatch showing the colour as you type.
Copy the HEX, RGB and HSL line together and paste it into your stylesheet or design tool.
Why this color converter beats juggling six pages
One card for every direction, with the colour itself in view.
HEX to RGB, RGB to HSL, HSL to HEX and the rest are all here, so you never have to open a second converter mid-task.
A live swatch sits beside the values, so a mistyped channel shows up as the wrong colour before it reaches your design.
The conversions use the same standard formulas as the single-purpose converters, so a result here matches the result there.
All conversion happens on your own device, so brand colours and unreleased palettes never leave your browser.
Color Converter FAQs
Short, direct answers to the questions readers ask most.
It combines them. A single-purpose converter handles one direction, such as HEX to RGB. This card handles all three notations at once, so you can start from whichever format you have and read off the other two.
A hex code writes the red, green and blue channels as six hexadecimal digits, for example #FF5733. Three-digit codes such as #F53 are expanded first, doubling each digit.
HSL describes a colour as hue (the angle around the colour wheel, 0 to 360), saturation (how vivid it is, 0 to 100%) and lightness (how dark or light it is, 0 to 100%). It makes muting or lightening a colour a one-number change.
Because HSL values are rounded for display — hue to a whole degree, saturation and lightness to one decimal. That rounding can shift a channel by 1 when you convert back to RGB or hex. The colour difference is invisible to the eye.
Yes. It runs entirely in your browser — no account, no signup, and nothing uploaded.
Related Tools
More free converters that work the same way — right in your browser.
Convert a single hex code to RGB numbers, with a live swatch.
RGB to HEX ConverterTurn RGB numbers into the hex code stylesheets expect.
HSL to HEX ConverterTurn an HSL colour into a hex code for stylesheets and design tools.
Image Color PickerClick any spot in an image to see its exact colour.
Try the related tools above, or go back to the Convertion homepage for more free converters.
