Color Converter
Convert any color between HEX, RGB and HSL formats.
Accepts hex (#3b82f6 or #f60), rgb(59, 130, 246) or hsl(217, 91%, 60%).
| Hex | #3B82F6 | |
| RGB | rgb(59, 130, 246) | |
| HSL | hsl(217, 91%, 60%) |
About Color Converter
The Color Converter translates any color between the three formats you meet daily in web work: hexadecimal (#3b82f6), RGB (rgb(59, 130, 246)) and HSL (hsl(217, 91%, 60%)). Paste a value in any of the three — or pick visually with the color swatch — and all formats appear together with one-click copy.
It closes the everyday gap between tools that speak different dialects: a design spec gives you HSL, DevTools shows computed RGB, and the stylesheet you are checking uses hex. Converting here confirms whether "those two colors" in a bug report are actually the same color. Everything runs locally in your browser.
How to use
- Paste a color into the "Color" field — hex (#3b82f6 or the #f60 shorthand), rgb() or hsl() are all detected automatically.
- Or click the color swatch to pick a color visually.
- Read the equivalent Hex, RGB and HSL values in the table, with a live preview of the color above it.
- Copy whichever format you need with its copy button. The preset buttons load example values in each format.
Frequently asked questions
Which input formats are accepted?
Six-digit hex (#3b82f6), three-digit shorthand (#f60), with or without the leading #, plus rgb()/rgba() and hsl()/hsla() functional notation. Alpha values are ignored — the conversion covers the opaque color.
Why do hex, RGB and HSL exist at all?
They describe the same color from different angles: hex and RGB encode the red/green/blue channels directly, while HSL describes hue, saturation and lightness — much easier for humans reasoning about "the same blue, but lighter". CSS accepts all three.
Can rounding change the color slightly?
Converting to HSL and back can shift a channel by a point due to rounding to whole degrees and percentages — visually imperceptible, but worth knowing if you compare strings byte-for-byte in an automated check.
Related tools
Number Base Converter
Convert integers between binary, octal, decimal and hex.
Cron Expression Explainer
Explain a cron expression in plain English and preview next runs.
Color Contrast Checker
Check a color pair against WCAG AA/AAA contrast levels.
JSON Pretty Printer
Format and indent JSON so it is easy to read.