HEX Color Picker
HEX Color Picker - a browser-based image tools utility.
Browser tool
About HEX Color Picker
The same colour has several correct spellings, and which one you need depends on where it is going: a HEX triplet in a stylesheet, an rgb() call with alpha, an HSL value you want to rotate. This converts between them and keeps them in step. Free to use online, and open to anyone without an account. There is nothing to upload, and the colour values stay in this page.
How to use it
- Choose or type a colourUse the picker, or type a value in any supported notation. Typing #3b82f6, rgb(59 130 246) or hsl(217 91% 60%) all resolve to the same colour.
- Adjust alpha if you need itAlpha appears in the notations that support it — eight-digit HEX, rgba() and hsla() — and is left out of the ones that do not.
- Copy the format you needEach notation can be copied on its own, so you are not editing a string by hand.
Why HSL is easier to reason about
HEX and RGB describe how much of each primary to mix, which is how a screen works and not how people think about colour. HSL describes hue, saturation and lightness separately, so making a colour lighter without changing the hue is one number instead of three. That is why design systems tend to be authored in HSL and shipped as HEX.
Three digits or six
A three-digit HEX is shorthand: #abc means #aabbcc. It can only express colours whose channel pairs repeat, so most colours need all six digits. The four and eight digit forms add an alpha channel in the same way.
What it does not do
- Conversions here are in sRGB, the colour space browsers assume for these notations. Wide-gamut values written in oklch() or display-p3 are a different space and will not round-trip through a HEX value.
- A colour that looks right on your screen may not on another. Only a calibrated display and a managed colour workflow can promise that, and no web tool can.
Questions people ask
- What does the eight-digit HEX mean?
- The last two digits are alpha, from 00 for fully transparent to FF for fully opaque. So #3b82f680 is the same blue at roughly 50% opacity.
- Why does my HSL value look slightly different after converting?
- HEX has 256 steps per channel, so converting from HSL rounds to the nearest representable colour. Round-tripping back can shift a hue by a degree or two. The visible difference is nil, but the number will not always match exactly.
Questions about ToolsVerse itself — privacy, cost, what happens to your files — are answered in the frequently asked questions.
Related tools
The tools people most often need alongside HEX Color Picker.
Can’t find the tool you need?
Tell us what you’re looking for and we’ll consider adding it.