RGB & Hex Color Codes Explained

What that string of six characters actually says to your screen, and how many colors it can name.

Short answer: a hex code like #FF8800 is a compact way of writing an RGB color. The six characters are three pairs (red, green, blue), each written in base-16 and running from 00 to FF, which is 0 to 255 in ordinary decimal. Hex and RGB name exactly the same colors, and so does HSL, because all three describe one underlying color space in different notations.

How a hex code maps to RGB

Split a hex code into its three pairs and you have an RGB triplet. In #FF8800 the first pair, FF, is red at 255 (its maximum); the second pair, 88, is green at 136; the last pair, 00, is blue at 0. Mixed together on a screen those levels make a warm orange. Hexadecimal is used because two base-16 digits map cleanly onto one 8-bit channel: the range 00 to FF covers all 256 possible levels of a channel in just two characters. So rgb(255, 136, 0) and #FF8800 are the same instruction written two ways.

You will also meet two close relatives of the six-digit form. A three-digit code such as #F80 is a shorthand in which each digit is doubled, so #F80 expands to #FF8800. An eight-digit code such as #FF8800CC adds a fourth pair for alpha, meaning opacity. Both are conveniences layered on the same red, green and blue idea, not new color systems.

Reading a code channel by channel

Because every code is just three numbers, a handful of them are worth memorizing. Once the pattern clicks you can often guess a color from its code before you paste it anywhere.

Two habits fall out of the table. When all three pairs are equal, as in #808080, the result is a neutral with no color cast. When one pair is FF and the other two are 00, you have one of the three pure primaries of light; combine two primaries at full strength and you get the secondaries in the middle rows.

Why #FFFFFF is white and #000000 is black

Screens mix light additively, so more of each primary means more light reaching your eye. When red, green and blue all sit at maximum (FF, FF, FF) the three lights combine into white. When all three sit at 00, no light leaves the pixel and you see black. Adding primaries in pairs gives the secondary colors of light: red plus green makes yellow, green plus blue makes cyan, and red plus blue makes magenta. This is the reverse of mixing paint, where combining pigments removes light and drifts toward a muddy dark. A screen builds color by adding; a paint palette builds it by subtracting.

The catch: the numbers are gamma-encoded

One accurate detail trips up many people. The 0 to 255 levels are not a linear measure of light. Standard web color uses the sRGB color space, whose transfer function is close to a 2.2-power curve, so a channel value of 128 does not emit half the light of 255. The encoding spends more of its steps on the darker tones that human vision is most sensitive to, which is why #808080 looks like a believable mid-gray even though 128 is well below half the actual luminance of white. For everyday design the codes behave intuitively. The gamma curve starts to matter when you blend, fade or resize images and need the arithmetic to match physical light rather than the encoded numbers.

How many colors the code can name

A standard 24-bit display gives 8 bits to each channel, so red, green and blue each have 256 levels. Multiply them: 256 × 256 × 256 = 16,777,216, usually rounded to about 16.7 million distinct codes. That is the size of the palette a six-digit hex code can address. Deeper formats exist: 10 bits per channel, often called deep color, reaches roughly 1.07 billion codes at the cost of larger files and wider hardware requirements.

It is worth separating what the format can store from what a person can see. The human eye is commonly estimated to distinguish on the order of a million shades, with higher ceilings sometimes cited, still well below the 16.7 million codes the 24-bit format can hold. The count of codes is a property of the file format; the count of distinguishable colors is a property of vision. Our companion piece on how many colors humans can see walks through where that estimate comes from and why it is so hard to pin down.

RGB, hex and HSL are one space

It is easy to assume RGB, hex and HSL are different kinds of color. They are not. HSL and its cousin HSV are transforms of RGB from the 1970s, designed to line the numbers up with how people talk about color. A hex code and its HSL equivalent point to the identical color; they only organize the same information differently. Choose whichever coordinate system fits the task: hex for exactness and copy-paste, HSL for nudging a shade by feel. If you want the reasoning behind the HSL dials, see hue, saturation and lightness explained.

Common misconceptions

A few beliefs are worth retiring. Hex is not a color model of its own; it is only a base-16 spelling of RGB. More available codes do not mean a screen can display them all, because the gamut a panel can physically reproduce is set by its real primaries, not by how many codes the format can name. And a longer code is not more precise per color; the six-digit and three-digit forms simply differ in how many of the 16.7 million colors they can reach.

Read colors by eye, not just by number

Related reading

• Hue, saturation & lightness explained: the HSL way of naming the same colors.
• How many colors can humans see?: why perception falls short of 16.7 million codes.
• Test how fine your own color sense is with Huefork.

Sources: MDN Web Docs: CSS <color> value (hex, rgb, hsl notations); Wikipedia: Web colors; Wikipedia: HSL and HSV; Lens.com: Color vision: discriminable colors