Hex, RGB & HSL: A Simple Guide to Color Codes

If you build websites or design graphics, you'll meet three ways of writing colors: HEX, RGB and HSL. Here's what each means.

HEX

A six-digit code like #2563EB. Two digits each for red, green and blue, written in hexadecimal. Compact and the most common in CSS.

RGB

rgb(37, 99, 235) — the same color as red, green and blue values from 0–255. Easy to read and to tweak programmatically.

HSL

hsl(221, 83%, 53%) — hue, saturation and lightness. The most intuitive for humans: change lightness to make a color darker or lighter without guessing.

Convert between them

Our Color Converter & Picker converts HEX ⇄ RGB ⇄ HSL instantly and includes a color picker. Need a whole scheme? Try the Color Palette Generator.