What is the difference between HEX and RGB?
They describe the same colour. HEX writes each channel as two hexadecimal digits, so #FF0000 is pure red, while RGB writes the channels in decimal, rgb(255, 0, 0). Both are fully supported in CSS.
Color Converter
Convert a HEX colour to RGB and HSL, with a CSS variable ready to paste, using the picker or a typed code.
Runs in your browser — nothing is uploaded
About the Color Converter
Designers and developers describe colours in different formats. HEX is compact and common in stylesheets, RGB gives the red, green and blue channels, and HSL describes hue, saturation and lightness, which is easier to adjust by hand.
Type a HEX code with three or six digits, or use the picker. The converter shows the same colour in each format, so you can copy whichever your design tool or stylesheet expects.
FAQ
Color Converter — frequently asked
Can I use three-digit HEX codes?
Yes. #F80 is shorthand for #FF8800. Each digit is doubled, so the three-digit form is exactly equivalent to the six-digit form.
What do the HSL numbers mean?
Hue is the position on the colour wheel in degrees, saturation is how vivid the colour is in percent, and lightness is how close it is to white or black. Changing only lightness makes a lighter or darker shade of the same colour.
Why do converted colours look slightly different on screen?
Monitors vary in calibration, and colour spaces such as Display P3 hold colours that sRGB cannot show. The values here are sRGB, which is what most web pages use.
Does this check contrast?
No. Use the colour contrast checker to test whether text and background colours meet WCAG accessibility thresholds.
Is my colour stored?
No. The conversion runs in your browser and nothing is saved.
Related tools
Color Contrast CheckerCheck the contrast ratio between text and background colours against WCAG AA and AAA thresholds, with a live preview.HMAC GeneratorCompute an HMAC signature for a message and secret key in hex or Base64, the same way most webhook and API providers do.Slug GeneratorTurn a title into a clean, lowercase URL slug with hyphens or underscores and accents removed.