Color HEX
Understanding hexadecimal color codes and notation
What Is Hexadecimal Color?
A HEX color code is a way of expressing a color using hexadecimal (base-16) notation. It uses the digits 0–9 and letters A–F to represent values from 0 to 255. Each color is written as a # followed by six hex digits: two for red, two for green, and two for blue.
How Hex Digits Map to 0–255
Each pair of hex digits represents a number from 00 (0 in decimal) to FF (255 in decimal). The formula is: first_digit × 16 + second_digit. For example, 6C = 6×16 + 12 = 108.
| Hex | Decimal | Hex | Decimal |
|---|---|---|---|
| 00 | 0 | 80 | 128 |
| 1A | 26 | 99 | 153 |
| 33 | 51 | B3 | 179 |
| 4D | 77 | CC | 204 |
| 66 | 102 | E6 | 230 |
| 7F | 127 | FF | 255 |
Interactive HEX Breakdown
Shorthand Notation: #RGB vs #RRGGBB
When each pair of hex digits has identical characters (like FF, 00, or AA), you can use shorthand — just three digits. The browser doubles each digit automatically.
| Shorthand | Full Form | Swatch |
|---|---|---|
| #F00 | #FF0000 | |
| #0F0 | #00FF00 | |
| #00F | #0000FF | |
| #FFF | #FFFFFF | |
| #000 | #000000 | |
| #F80 | #FF8800 | |
| #ABC | #AABBCC | |
| #369 | #336699 |
Common HEX Colors
Try It — CSS HEX Syntax
.element {
background-color: #4285F4;
color: #ffffff;
padding: 24px;
}#FF000080 is a 50% transparent red. The alpha value 80 hex = 128 decimal ≈ 50%.How to Use Color HEX?
- 1Choose a base color using the interactive picker or enter HEX, RGB, HSL values.
- 2Generate matching color palettes, schemes, or color space transformations instantly.
- 3Click on any color code block in the results to copy it instantly to your clipboard.
Designer Friendly
Easily match colors, check contrast ratios, and generate custom palettes for your designs.
Multi-Format Support
Supports copy-paste in HEX, RGB, RGBA, HSL, HSLA, and CSS variables formats.
Runs Locally
No internet connection required. Our color engines run instantly and cleanly inside your web browser.