Color Converter

Convert a HEX colour code to RGB and HSL, ready to paste into CSS. It runs in your browser.

How to use it

1. Type a HEX code, with or without the #. Three-digit shorthand works too.
2. Read the HEX, RGB and HSL values and copy the one you need.

Examples

• #3b82f6 = rgb(59, 130, 246) = hsl(217, 91%, 60%).
• #fff = rgb(255, 255, 255) = hsl(0, 0%, 100%).

Good to know

A HEX code is three base-16 numbers: red, green and blue, each 0 to 255 (for example 3B is 59). HSL describes the same colour by hue in degrees, saturation and lightness, which makes lighter and darker variations easy: keep the hue and change the lightness. HEX and RGB are exact equivalents, but HSL values are rounded to whole numbers. Eight-digit HEX with transparency is not supported, so add transparency yourself with rgba().

See the guide and the RGB and HSL entries. To check readability, use the Contrast Checker.

FAQs