HEX ↔ RGB ↔ HSL Converter

A colour converter translates one colour between the notations used across design and development: HEX codes from a style guide, RGB values from an image editor, HSL from a CSS file, CMYK for print. They all describe the same colour, but tools and teams rarely agree on which to use.

Paste a colour in any CSS syntax, including transparency, and this converter shows every equivalent format. You can also edit the red, green and blue values or the hue, saturation and lightness numbers directly and watch all the formats and the swatch update together.

HEX and RGB both describe red, green and blue from 0 to 255; HEX simply writes each number as two hexadecimal digits. HSL describes the same colour as a hue angle, a saturation and a lightness, and HSV uses value instead of lightness, as many design tools do.

Transparency (alpha) is supported in eight-digit HEX like #33669980, and in the modern rgb(r g b / a) and hsl(h s% l% / a) syntax all current browsers accept. Rounding HSL to whole numbers can shift a colour by one step in RGB.