Article — Hex to RGB Converter
Hex to RGB converter: colour codes for the web
A hex to RGB converter turns a colour code like #FF6699 into red, green, and blue values from 0 to 255. The math is direct: split the six hex digits into three pairs and convert each pair from base-16 to base-10. This calculator goes further, also producing HSL (hue/saturation/lightness) and CMYK (cyan/magenta/yellow/black) outputs, a live colour swatch, and channel bars so you can see the colour and its decomposition at once.
Hex notation is the dominant way to specify colours in HTML, CSS, design tools, and graphics APIs. It is compact (7 characters with the hash), unambiguous, and represents the full 24-bit sRGB gamut of 16.7 million colours. Designers may prefer HSL for editing, but hex is what gets shipped.
What the hex to RGB converter does
Type a hex code (e.g. #FF6699) or use the colour picker to choose visually. The calculator parses the hex, computes R/G/B integers, then derives HSL and CMYK. All outputs update live.
Supported hex formats: #RGB (3-digit shorthand, expanded to 6), #RRGGBB (standard 24-bit), and #RRGGBBAA (24-bit + 8-bit alpha). Case is normalised to uppercase. Invalid input shows “Invalid hex” without throwing an error.
Hex colour code anatomy
A standard hex code has seven characters: a leading hash (#) and six hexadecimal digits. The six digits group into three pairs — one pair each for red, green, and blue.
#FF6699 = R(FF) G(66) B(99)FF (hex) = 255 (decimal) = max red66 (hex) = 102 (decimal) = mid green99 (hex) = 153 (decimal) = high blueEach pair encodes a value from 00 (decimal 0, no intensity) to FF (decimal 255, full intensity). Three pairs × 8 bits = 24 bits = 16,777,216 (2²⁴) distinct colours. This is the “true colour” sRGB gamut every web browser assumes by default.
Hex to RGB conversion math
The conversion is a base change: hexadecimal (base 16) to decimal (base 10). Each hex digit represents 4 bits; a pair represents 8 bits = one byte.
FF = 15×16 + 15 = 240 + 15 = 25566 = 6×16 + 6 = 96 + 6 = 10299 = 9×16 + 9 = 144 + 9 = 153#FF6699 → rgb(255, 102, 153)In JavaScript: parseInt('FF', 16) = 255. In Python: int('FF', 16) = 255. In CSS, you can write color: #FF6699 or color: rgb(255, 102, 153) — the browser renders them identically because they describe the same colour.
The hex colour notation was standardised in HTML 4.01 (1999) and CSS Level 2 (1998), but it dates from earlier. HTML 2.0 (1995) supported six-digit hex in BGCOLOR and other attributes. Before that, colour was specified by named tokens (“red,” “blue”) only — about 16 in Mosaic, expanded to ~140 web-safe names in Netscape. Hex provided full 24-bit control.
Three-digit hex shorthand
CSS allows a 3-digit hex shorthand where each digit is duplicated:
#F09 ≡ #FF0099#ABC ≡ #AABBCC#000 ≡ #000000 (black)#FFF ≡ #FFFFFF (white)The shorthand can only represent 4096 distinct colours (16³), because each channel can only be 00, 11, 22, …, FF (steps of 17 in decimal). For most designs that is enough; for gradients and precise brand colours, use the full 6-digit form.
RGB, HSL, and CMYK relationships
Three colour models for three purposes.
RGB is hardware-friendly. Each pixel on a display has red, green, and blue sub-pixels; setting their intensities additively produces colour. Hex and rgb() are the same model in different notations.
HSL is human-friendly. Hue (0–360°) picks the colour on the rainbow wheel. Saturation (0–100%) controls vividness from grey to pure. Lightness (0–100%) goes from black through pure colour to white. Designers usually adjust in HSL because it matches intuition: brightening a colour without changing its hue is just an L adjustment.
CMYK is print-friendly. Cyan, magenta, yellow, and key (black) inks are the four-colour printing standard. Inks absorb light rather than emit it, so the model is subtractive. The conversion from RGB to CMYK in this calculator uses the simple formula (no ICC profile); commercial printing requires device-specific profiles for accurate colour matching.
For accessibility work, HSL Lightness is your friend. Two colours need a contrast ratio of at least 4.5 for body text (WCAG AA). Lightness alone does not predict contrast (because the eye is most sensitive to green), but it is a useful first check. A foreground and background separated by 50% Lightness almost always pass; less than 30% almost always fail.
Hex/RGB alpha channel
An 8-digit hex code adds an alpha channel: #RRGGBBAA. The last two digits encode transparency from 00 (fully transparent) to FF (fully opaque). In CSS, the equivalent is rgba(r, g, b, a) where alpha is a 0–1 float.
#FF669900 = rgba(255, 102, 153, 0) fully transparent#FF669980 = rgba(255, 102, 153, 0.5) half transparent#FF6699FF = rgba(255, 102, 153, 1) fully opaque#FF6699 = same as #FF6699FFThe 4-digit shorthand #RGBA also works in modern CSS (since CSS Color Module Level 4). The alpha channel is widely supported in modern browsers but not in older email clients — if you are styling email, stick to opaque hex.
Common hex to RGB mistakes
Beginners sometimes read #F09 as red 240, green 0, blue 144 — treating each digit as 16×. That is wrong. The CSS expansion is digit duplication: #F09 = #FF0099 = red 255, green 0, blue 153. The values 240 and 144 do not appear in 3-digit shorthand at all.
- Missing hash (#): CSS requires it;
color: FF6699fails silently - Wrong case:
#FF6699and#ff6699are equivalent (case insensitive) - 5-digit hex: invalid; CSS accepts only 3, 4, 6, or 8 digits
- Hex with 0x prefix:
0xFF6699is JavaScript/C syntax, not CSS - Alpha range mismatch: CSS rgba() uses 0–1; CSS hex uses 00–FF
- sRGB assumed: most browsers do not honour P3 or other gamuts unless specified
Hex and modern colour spaces
Hex/RGB describes sRGB, the colour space of most monitors. Modern wide-gamut displays (Apple Display P3, Adobe RGB, Rec.2020 for HDR video) can reproduce colours that sRGB cannot reach — particularly saturated reds and greens. CSS Color Module Level 4 added the color() function so designers can specify gamut explicitly, e.g. color(display-p3 1 0 0.4). Browser support is still uneven: Safari handles P3 best, Chrome and Firefox are catching up.
For most web work, hex/RGB in sRGB is the right tool. It is universally supported, easy to type, and matches what most users see on most devices. Reach for wider gamut formats only when designing for high-end displays where the colour difference is visible and meaningful. The calculator at the top of this page handles standard sRGB hex codes — the format the vast majority of design tools, photo editors, and CSS files use every day.