Hex to RGB Color Converter

How to use the color converter (hex/rgb/hsl/cmyk)

1. Enter a color in any supported format: #3498db, rgb(52, 152, 219), hsl(204, 70%, 53%) or cmyk(76, 31, 0, 14).
2. The tool parses your input and identifies whether it is HEX, RGB, RGBA, HSL or CMYK.
3. All equivalent color values appear instantly below the input field.
4. Copy the format you need for CSS, design software or print specifications.

How hex to rgb conversion works

A six-digit hexadecimal color code contains three pairs of characters representing red, green and blue channels. Each pair is a base-16 number from 00 to FF, which maps to decimal values 0 through 255.

To perform a hex to rgb conversion, split the string into three pairs and convert each from base 16 to base 10. For example, #3498db splits into 34, 98 and db. Converting those gives 3 times 16 plus 4 equals 52 for red, 9 times 16 plus 8 equals 152 for green, and 13 times 16 plus 11 equals 219 for blue. The result is rgb(52, 152, 219).

Three-digit shorthand like #f00 expands by doubling each character to #ff0000 before converting. Eight-digit hex codes add an alpha channel where ff is fully opaque and 00 is fully transparent.

Converting RGB to HSL

HSL stands for hue, saturation and lightness. Hue is an angle on the color wheel from 0 to 360 degrees. Saturation and lightness are percentages from 0 to 100.

The conversion starts by dividing the R, G and B values by 255 to get fractions between 0 and 1. Find the maximum and minimum of those three fractions. Lightness is the average of the max and min. If max equals min, the color is a shade of gray with zero saturation and undefined hue (set to 0). Otherwise, saturation depends on lightness: if lightness is 0.5 or less, saturation is (max minus min) divided by (max plus min); if above 0.5, divide by (2 minus max minus min).

Hue is calculated based on which channel is the maximum. If red is max, hue is 60 times ((green minus blue) divided by (max minus min)). If green is max, add 120 degrees. If blue is max, add 240 degrees. Negative hue values get 360 added to wrap around the circle.

CMYK to hex conversion for print and screen

CMYK is a subtractive color model used in printing, standing for cyan, magenta, yellow and key (black). Values range from 0% to 100%. To go from cmyk to hex, first convert CMYK to RGB using these formulas:

• R = 255 x (1 - C) x (1 - K)
• G = 255 x (1 - M) x (1 - K)
• B = 255 x (1 - Y) x (1 - K)

Where C, M, Y and K are expressed as decimals (so 76% becomes 0.76). After computing R, G and B, round them to integers and convert to hexadecimal as described above.

Note that CMYK has a smaller gamut than RGB. Some bright screen colors cannot be reproduced exactly in print ink, so conversions may look slightly different on paper than on a monitor.

Common color reference table

This table shows several standard colors across all four formats. Use it as a quick lookup when you need to convert hex to rgb or check a familiar color.

Using hex to rgba for transparency

CSS supports an alpha channel for opacity. When you need hex to rgba conversion, use an eight-digit hex code where the last two digits represent alpha. For example, #ff000080 is red at roughly 50% opacity because 80 in hex is 128 in decimal, and 128 divided by 255 is approximately 0.502.

In CSS, you can write this as rgba(255, 0, 0, 0.502) or use the modern space-separated syntax rgb(255 0 0 / 0.502). Both are valid in current browsers. The color converter on this page outputs the traditional comma-separated rgba format for broad compatibility.

Remember that HSL also supports alpha via hsla(). A fully transparent version of any color simply sets the alpha value to 0 regardless of the hue, saturation or lightness.

Common mistakes with color formats

Several pitfalls trip up developers when working with color codes:

• Forgetting the hash symbol. CSS requires # before hex values. Writing color: ff0000; will not work; it must be color: #ff0000;.
• Mixing percentage and integer RGB. The rgb() function accepts either 0 to 255 integers or 0% to 100% values, but you cannot mix them. rgb(255, 50%, 0) is invalid.
• HSL units. Hue is a plain number in degrees (no unit suffix needed in CSS), while saturation and lightness require percent signs. Writing hsl(120, 1, 0.5) instead of hsl(120, 100%, 50%) produces unexpected results in most browsers.
• CMYK ranges. CMYK values must be between 0 and 100 percent. Entering 255 as you would for RGB is a common error when doing cmyk to hex conversion manually.

Worked examples

Each result below was produced by the same code the tool runs, so you can check your own numbers against them.

Reference pages

• CSS named colors and hex codes: values, shades and contrast for each color name.