Color converter
Convert a color between HEX, RGB, and HSL formats simultaneously, with a live swatch showing the actual color.
How it works
HEX and RGB are the same thing written differently. Both give the intensity of a
red, a green, and a blue light from 0 to 255 — HEX just packs each of those
bytes into two base-16 digits, so #336699 is
literally 51, 102, 153. That is why the shorthand
#369 works by doubling each digit rather than
padding with zeros. HSL rearranges the same colour into three things a person can
actually reason about: hue as an angle around the colour wheel, saturation as how
far it is from grey, and lightness as how far it is from black or white. The
practical difference shows up when you want a darker version of a colour. In RGB
you have to scale three numbers and hope the hue survives; in HSL you drop the
lightness and nothing else moves. Hue comes from whichever channel is largest, and
saturation and lightness both fall out of the gap between the largest and smallest
— which is why a grey, whose channels are all equal, has no meaningful hue
at all.