Skip to content
Kolorvia
Color Theory

What Is HEX? A Practical Guide to Hexadecimal Color Codes

HEX codes are the six-digit shorthand browsers and design tools use to represent color. Here's how they're built, and when to reach for HEX over RGB or HSL.

· 2 min read

On this page

What a HEX code actually is

A HEX color code is a six-digit value, prefixed with a #, that represents a color the same way browsers, design tools, and image editors do internally. Each pair of digits encodes one channel of red, green, and blue on a scale from 00 to FF — that's 0 to 255 in decimal. #FF0000 is pure red: full red, no green, no blue. #000000 is black, and #FFFFFF is white.

Why hexadecimal instead of plain numbers

Hexadecimal (base 16) packs the 0–255 range for each channel into exactly two characters, using 0–9 and A–F. That's why HEX codes are always six characters long for RGB — two per channel — rather than a variable-length list like rgb(255, 0, 0). It's compact, easy to copy and paste, and has been the standard way to specify color in HTML and CSS since the early web.

Shorthand and alpha notation

When both digits in each pair match, CSS allows a three-character shorthand: #F00 is identical to #FF0000. There's also an eight-digit variant, #RRGGBBAA, where the final pair adds an alpha (transparency) channel — #FF000080 is red at roughly 50% opacity.

When to reach for HEX vs. RGB or HSL

HEX is ideal when you need to store or share an exact, unambiguous color value — in a design system, a brand guideline, or a CSS variable. RGB and HSL are usually easier to reason about when you're actively adjusting a color: HSL in particular separates hue, saturation, and lightness, which makes it simpler to create a lighter or more muted version of a color without recalculating three separate numbers. All three notations describe the same underlying color space; converting between them is lossless.

Related guides

Try it yourself

Put the theory into practice

Everything this guide explains is built into a free, live tool — try the math yourself.

We use cookies for site preferences and, where enabled, Google Analytics and Google AdSense — which may use cookies to personalize ads based on your visits here and elsewhere. See our Privacy Policy for details. Your color tool inputs are never sent to us regardless of your choice.