Color Converter
Free color converter. Convert colors between HEX, RGB and HSL formats with a live preview, or pick any color visually. Copy CSS-ready values instantly.
About the Color Converter
Enter a color in any common format — #2563eb, rgb(37, 99, 235) or hsl(217, 91%, 53%) — and this converter instantly shows all three, with a live swatch and one-click copy of CSS-ready values. The native picker lets you explore visually and syncs both ways.
HEX, RGB, HSL — when to use which
- HEX is the web default: compact, universally supported, easy to copy from design tools like Figma.
- RGB spells out the red, green and blue channels (0–255). Handy when you are adjusting one channel or reading rgba() alpha values.
- HSL describes hue (0–360°), saturation and lightness. It is the human-friendly one: make a color lighter by raising L, or build a whole palette by keeping H and S and stepping L.
The conversions use the standard sRGB formulas, so what you copy matches what browsers, CSS and design tools display.
Frequently asked questions
How do I convert HEX to RGB by hand?
Split the six digits into three pairs and convert each from hexadecimal. #2563eb becomes 0x25=37 red, 0x63=99 green, 0xeb=235 blue. This converter does it instantly, including 3-digit shorthand like #f90.
When should I use HSL instead of HEX?
HSL shines when you are building palettes programmatically or tweaking a color’s brightness: raising lightness from 45% to 60% is intuitive, while guessing the equivalent HEX is not. HEX remains the best format for copying exact colors between tools.
Do you support RGBA or transparency?
RGBA inputs are parsed (the alpha is ignored for conversion). For opacity, take the RGB value from here and append the alpha in your CSS, e.g. rgba(37, 99, 235, 0.5).
Why does my color look different in print?
Screens use additive RGB light; printing uses subtractive CMYK inks with a smaller gamut. Always check brand colors with a printed proof — a perfect RGB to CMYK conversion does not exist.