Loading tool…
Convert any color between HEX, RGB and HSL. Type into any field and the other two update instantly, with a live preview swatch.
Loading tool…
Color is a free, private online tool that lets you convert colors between HEX, RGB and HSL with a live swatch. It runs entirely in your browser, so nothing you enter is uploaded to a server.
Privacy: this tool runs entirely in your browser. Your input is never sent to, received by, or stored on any server — there are no uploads and no tracking of what you enter.
HEX (#3b82f6) and RGB (59, 130, 246) describe a color by its red, green and blue components. HSL (217, 91%, 60%) describes it by hue, saturation and lightness, which is often more intuitive for tweaking.
HEX and RGB are two notations for the same values, so conversion is exact. HSL is a different model, computed from the RGB values — handy for creating lighter/darker variants by adjusting lightness.
CSS, design tools and brand palettes mix all three formats. This converter saves you from manual math when a spec gives you one format but you need another.
#39f is expanded to #3399ff automatically.A color converter translates a single color between the different notations used across design and code - HEX, RGB, HSL and CMYK. They all describe the same color, but different tools and contexts expect different formats, so converting between them is a constant task for designers and developers. Edit any field and the others update to match, with a live preview swatch.
Screens build color from red, green and blue light. RGB writes each channel as a number from 0 to 255, like rgb(59, 130, 246). HEX is the same three values packed into a six-digit hexadecimal string, two digits per channel, like #3b82f6. They are interchangeable - HEX is just a compact way to write RGB - which is why conversion between them is exact.
Convert a brand HEX into RGB for a CSS gradient, into HSL to derive hover and active states, or into CMYK for a print spec; match a color picked from a design tool; and keep a palette consistent across web and print. Everything runs in your browser, with a live preview so you can see exactly what each value produces.