Color Converter
Convert colors between HEX, RGB and HSL formats instantly, with a live swatch preview.
- HEX
- #4f46e5
- RGB
- rgb(79, 70, 229)
- HSL
- hsl(243, 75%, 59%)
How it works
The tool accepts a color in any of three common formats — #rrggbb hex, rgb(r, g, b), or hsl(h, s%, l%) — parses it into red/green/blue components, and derives the other two formats from that: HEX is each channel written as a two-digit base-16 number; HSL is computed with the standard hue-saturation-lightness formulas, where lightness is the midpoint of the brightest and darkest channel and hue comes from which channel is largest.
Example
ff8800 (a vivid orange) is rgb(255, 136, 0) and hsl(32, 100%, 50%). Going the other way, rgb(79, 70, 229) converts to the hex #4f46e5 — the indigo used in many UI design systems.
Frequently asked questions
What formats can I paste in?
A 3- or 6-digit hex code (with or without the leading #), rgb(...) / rgba(...), or hsl(...) / hsla(...) — the tool auto-detects which format you typed.
What happens if I type an invalid color?
The tool shows a message asking for a valid hex, rgb() or hsl() value instead of guessing — it never silently shows a wrong color.
Why do HEX and RGB always match exactly, but HSL can look slightly different from other converters?
HSL involves floating-point calculations rounded to whole numbers for readability; different tools may round at a different step, giving results that differ by 1 in rare cases.
Can I copy the result straight into my CSS?
Yes — each format has its own Copy button, so you can grab hex, rgb() or hsl() exactly as written, ready to paste into a stylesheet.
Related tools
Generate SHA-1, SHA-256 and SHA-512 hashes of any text, computed live in your browser.
JSON Formatter & ValidatorFormat, validate and minify JSON online with clear error messages pointing at the failing line.
UUID GeneratorGenerate one or many random v4 UUIDs using your browser's cryptographic randomness.