Color Converter
HEX ↔ RGB ↔ HSL with a live preview.
#2dd4bfrgb(45, 212, 191)hsl(172, 66%, 50%)Runs entirely in your browser — nothing you enter is uploaded or sent to a server.
HSL is shown in whole degrees and percentages, so converting back can land a shade off — the HEX and RGB values are the exact ones to rely on. Read our full disclaimer.
About this tool
Designers and developers juggle color in three notations: HEX (#2dd4bf), RGB (rgb(45, 212, 191)), and HSL (hsl(174, 65%, 50%)). This tool parses any of them and shows the other two, with a live preview so you can see exactly what you're working with. Use the native color picker to dial in a shade, or paste a value from your CSS.
Try it
#2dd4bf is rgb(45, 212, 191) and hsl(174, 65%, 50%). Paste any one and the tool fills in the rest.
How to use
- 1Type or paste a color in HEX, rgb(), or hsl() — or use the color picker.
- 2See the live preview swatch update instantly.
- 3Read the equivalent HEX, RGB, and HSL values.
- 4Copy any format with one click.
Features
- Parses HEX (3/4/6/8-digit), rgb()/rgba(), and hsl()/hsla().
- Live preview swatch plus a native colour picker.
- One-click copy for each format.
Frequently asked questions
Why does the HSL sometimes round-trip a shade off?
HSL is shown as whole degrees and percentages, so converting back to RGB can differ by a unit or two. The HEX and RGB values are exact.
Does it support alpha / transparency?
It accepts 4- and 8-digit HEX and rgba()/hsla() input, but the conversions focus on the solid color (alpha is ignored in the output).
More developer tools
View allJSON Formatter
Paste raw JSON and get it neatly indented, minified, or validated — entirely in your browser.
Open toolBase64 Encoder / Decoder
Encode any text to Base64 or decode it back, instantly and locally — with full Unicode and emoji support.
Open toolHash Generator
Compute cryptographic hash digests of any text with the SHA family, locally via the Web Crypto API.
Open tool