Color Converter
Convert colors between HEX, RGB/RGBA and HSL/HSLA with a live swatch preview. Paste any common CSS color format and get all equivalents plus copyable strings.
Accepted formats
3- and 6-digit hex, 4- and 8-digit hex with alpha (#RRGGBBAA), rgb()/rgba() with or without percentages, hsl()/hsla() with hue in any unit (deg/rad/turn stripped), plain 99,102,241 triplets, and the 16 named CSS colors plus common extras. Alpha below 1 is preserved in RGBA/HSLA output; the hex output then uses the 8-digit form.
How to use Color Converter
Type or paste a color in any supported format — #1e90ff, rgb(30 144 255) or hsl(210 100% 56%) — and the converter answers with every other format plus the nearest CSS named color. The swatch and contrast hints update as you type, and one click copies any variant as ready-to-paste CSS.
The dark/light preview helps you check legibility for both themes before shipping a palette. The same panel also explains what a hex value means in numerical channels, which is handy when porting design tokens into canvas code or validating colors that arrived from a design tool.
Frequently asked questions
Which color formats can I convert between?
HEX (#rrggbb), RGB and RGBa, HSL and HSLa, plus the full set of CSS named colors. Conversions go both ways and the nearest named color is shown when one matches.
How do I convert HEX to RGB?
Paste any hex value like #1e90ff, with or without the hash, into the input. The tool instantly shows RGB, HSL and a ready-to-paste CSS variable, parsing each channel as two hex digits.
Why do HSL values sometimes round differently?
HSL channels are floating point values. The tool rounds hue to whole degrees and saturation or lightness to whole percentages, which keeps CSS output clean and predictable.
Does the converter show a live preview?
Yes. The swatch and contrast hint update as you type, and the color is checked against both light and dark themes so you can judge legibility immediately.