How to read a six-digit HEX color code

Start by splitting #RRGGBB into three pairs

Ignore the hash for a moment and group the six digits from left to right: RR, GG, and BB. The first pair controls the red sRGB channel, the second controls green, and the third controls blue. Each pair is one byte, so its decimal value ranges from 0 to 255.

#4F46E5
  4F  → red
  46  → green
  E5  → blue

Read one hexadecimal pair

Hexadecimal uses sixteen symbols instead of ten. The digits 0 through 9 keep their usual values, then A, B, C, D, E, and F represent 10 through 15. Letter case has no effect, so ff, Ff, and FF all mean the same number.

• The left digit counts groups of sixteen.
• The right digit counts individual units.
• Multiply the left value by 16, then add the right value.
• 00 is 0; FF is 15 × 16 + 15, which equals 255.

4F = 4 × 16 + 15 = 79
46 = 4 × 16 + 6  = 70
E5 = 14 × 16 + 5 = 229

Decode #4F46E5 from beginning to end

Apply the pair calculation three times. Red is 4F, or 79. Green is 46, or 70. Blue is E5, or 229. The same CSS color can therefore be written as rgb(79 70 229). The blue channel is much larger than the other two, which helps explain the blue-violet direction of this particular color.

.sample {
  color: #4F46E5;
  background-color: rgb(79 70 229);
}

Channel size is useful evidence, but it is not a complete description of appearance. sRGB values are encoded rather than linear-light measurements, displays differ, surrounding colors change perception, and perceived brightness does not equal the arithmetic average of R, G, and B.

Recognize useful patterns without doing all the arithmetic

Several channel patterns are readable at a glance. A pair near 00 contributes little of that channel; a pair near FF contributes a lot. Equal red, green, and blue pairs produce an achromatic sRGB gray. Two high channels and one low channel often point toward a familiar secondary direction, but exact appearance still depends on all three values.

• #000000 has all channels at 0 and represents black.
• #FFFFFF has all channels at 255 and represents white.
• #808080 has three equal channels and represents a mid-code gray.
• #FF0000, #00FF00, and #0000FF maximize one sRGB channel.
• #FFFF00 combines maximum red and green with no blue.

Know when three-digit shorthand is exact

CSS also accepts three-digit HEX. It does not pad a missing digit with zero. Instead, each digit is duplicated: #4AE expands to #44AAEE. The shorthand is exact only when every pair in the six-digit value contains two identical digits.

• #FFFFFF can become #FFF.
• #00FF00 can become #0F0.
• #44AAEE can become #4AE.
• #4F46E5 cannot be shortened because 4F, 46, and E5 are not repeated pairs.

Three digits can express 16 × 16 × 16, or 4,096 colors. Six digits can express 256 × 256 × 256, or 16,777,216 channel combinations. Shorthand is therefore a compact spelling for a subset, not a rounded form of every color.

Read eight-digit HEX and its alpha pair

An eight-digit CSS HEX value uses #RRGGBBAA. The first six digits are read exactly as before; the final AA pair controls alpha. 00 is fully transparent and FF is fully opaque. For example, 80 is 128 out of 255, or about 50.2% alpha.

.overlay {
  /* Same sRGB channels, about 50% alpha */
  background: #4F46E580;
  background: rgb(79 70 229 / 50.2%);
}

Use a reliable inspection checklist

• Confirm that the value starts with # and contains exactly 3, 4, 6, or 8 hexadecimal digits for CSS.
• For six digits, split it as RR, GG, BB before converting anything.
• Convert a pair with left × 16 + right; remember A through F mean 10 through 15.
• Treat letter case as formatting only.
• Expand shorthand by duplicating each digit, never by appending zeros.
• For eight digits, read the last pair as alpha after RGB.
• Use computed luminance and contrast instead of inferring accessibility from channel size.

Color Atlas performs these conversions deterministically from the reviewed canonical HEX value. A color page lets you verify RGB, HSL, HWB, alpha variants, relative luminance, contrast, and related values without replacing the source code with generated prose.