HEX to RGB

How hex colours work

A hex colour like #FF8800 is three bytes written in hexadecimal: FF red, 88 green, 00 blue. Each pair ranges from 00 (0) to FF (255), so #FF8800 is rgb(255, 136, 0), a bright orange. The short form #F80 repeats each digit and means the same colour. An optional fourth pair sets transparency: #FF880080 is the same orange at about 50% opacity.

Designers pick colours in hex, but canvas code, image libraries, Android colours and many APIs want separate RGB numbers. This page also gives HSL (useful for making lighter or darker shades), HSV, a naive CMYK and the WCAG contrast ratio against white and black text.

Worked example

#767676: 76 hex = 7 × 16 + 6 = 118, so the colour is rgb(118, 118, 118), a mid grey. Its contrast ratio against white is 4.54:1, just above the 4.5:1 that WCAG 2.2 requires for normal text, which is why it is a popular "lightest accessible grey".

The page splits the hex code into pairs of digits and converts each from base 16 to a number from 0 to 255; three- and four-digit codes are expanded first by repeating each digit, and an alpha pair is divided by 255. HSL and HSV are computed with the CSS Color 4 formulas. For contrast, each channel is converted to linear light, combined into relative luminance with the WCAG weights (0.2126 red, 0.7152 green, 0.0722 blue), and compared as (lighter + 0.05) ÷ (darker + 0.05). Everything runs in this tab.