Color Converter

HEX (like #ec4899) is a compact hexadecimal code that's the standard for CSS, design tools and image editors. RGB (like rgb(236, 72, 153)) expresses a color as red, green and blue values from 0-255, which is easier to manipulate programmatically. HSL (like hsl(330, 82%, 60%)) expresses hue, saturation and lightness, which makes it much more intuitive to tweak a color's brightness or intensity by hand.

All three are valid CSS. HEX is the most common for static design specs and copy-pasting from design tools. HSL is often preferable when you need to programmatically lighten, darken or desaturate a color, since you can adjust the lightness or saturation value directly without recalculating RGB channels.

You can enter 6-digit HEX (#ec4899), 3-digit shorthand HEX (#f0a), rgb()/rgba(), or hsl()/hsla() values. The converter parses whichever format you paste in and instantly shows the equivalent HEX, RGB and HSL values.

The converter accepts rgba() and hsla() input with an alpha channel, but the HEX, RGB and HSL values it outputs are fully opaque — alpha is dropped during conversion since HEX and the plain RGB/HSL outputs don't carry transparency information on their own.

The same RGB or HEX value can render differently across monitors and devices because of differences in color profile, gamma calibration and display technology. The numeric value stays identical — what changes is how each screen interprets and displays it.