HEX vs RGB vs HSL: color codes for developers

Every color on screen is red + green + blue light. The three common notations — HEX, RGB and HSL — are just different ways of writing that same triple.

HEX: compact and universal

#6366f1 stores each channel as two hex digits: red 0x63 = 99, green 0x66 = 102, blue 0xf1 = 241. That's rgb(99, 102, 241). HEX is the lingua franca of CSS and design tools — convert freely with our hex to RGB converter.

RGB: transparent and precise

rgb(99, 102, 241) is the same color written in decimal. RGB also supports alpha — rgba() — which HEX can only express with extra digits (#6366f1ff).

HSL: the human one

HSL breaks color into hue (0–360° on the wheel), saturation and lightness. Making a button darker is lowering lightness — no math required. Designers adjust in HSL, then ship in HEX.

Build palettes, not single colors

Good designs use harmonious sets, not random picks. Try our color palette generator to build cohesive schemes from any seed color in seconds.