About Color Formats
Colors on the web are commonly expressed in three formats: HEX, RGB, and HSL. HEX (like #FF6347) is a six-digit hexadecimal code for the red, green, and blue channels. RGB (like rgb(255, 99, 71)) expresses the same channels as decimal values from 0 to 255. HSL (like hsl(9, 100%, 64%)) describes color by Hue, Saturation, and Lightness, which is often more intuitive for adjusting colors.
This tool keeps all three formats and the color picker in sync. Edit any representation and the swatch and all other fields update instantly, so you can convert HEX to RGB, RGB to HSL, HSL to HEX, and every combination in between.
Frequently Asked Questions
Split the six-digit hex code into three pairs of two digits, then convert each pair from hexadecimal to decimal. For example, #FF6347 becomes FF = 255, 63 = 99, and 47 = 71, giving rgb(255, 99, 71). Just paste your hex code into the HEX field to see the RGB result.
RGB defines color by mixing red, green, and blue light. HSL defines color by Hue (the color on the wheel, 0-360 degrees), Saturation (how vivid it is), and Lightness (how bright it is). HSL is often easier for designers because you can tweak brightness or vividness without recalculating individual channels.
Yes. Shorthand three-digit hex codes like #F63 are supported and expand automatically. Each digit is doubled, so #F63 is equivalent to #FF6633. The converter accepts codes with or without the leading # symbol.
HSL values are rounded to whole numbers for readability, and RGB channels are integers from 0-255. Converting back and forth can round to the nearest representable color, so a value may shift by one unit. The visible color remains effectively identical.
Yes. The CSS Strings section outputs values in standard CSS syntax, such as #FF6347, rgb(255, 99, 71), and hsl(9, 100%, 64%). Use the Copy buttons to paste them directly into your stylesheets or inline styles.
