RGB and Hex Colors: Conversion, Chart, and Contrast

Red, green, and blue glass blocks stand beside neutral and teal color swatches. — Conceptual illustration: RGB channels describe a color; readability depends on its surroundings.

An RGB hex triplet writes red, green, and blue channel values as six hexadecimal digits. Use the conversion tool below to move between decimal RGB and hex, then check the actual foreground and background together. The historical web-safe palette remains a useful reference, while text readability depends on the chosen pair.

Convert RGB and hex

Read and calculate a hex triplet

Split #336699 into 33, 66, and 99. Hexadecimal uses digits 0–9 followed by A–F for values 10–15. Each pair is its first digit times 16 plus its second digit: 3 × 16 + 3 = 51; 6 × 16 + 6 = 102; 9 × 16 + 9 = 153.

For the reverse conversion, divide a channel by 16. The integer quotient is the first digit and the remainder is the second. Decimal 200 is 12 × 16 + 8, so its hex pair is C8. Pad small values with a leading zero: decimal 5 becomes 05. Uppercase and lowercase hex letters express the same value.

W3C's CSS hexadecimal notation defines the short forms too: #369 expands to #336699 by repeating each digit. Eight-digit #RRGGBBAA adds alpha at the end; #33669980 is approximately half opaque. This tool handles opaque six-digit sRGB values so its assumptions remain clear.

.example {
  color: #336699;
  background-color: #ffffff;
}

In this example the first declaration colors text and the second sets its background. A color assigned to a parent can be overridden by a more specific rule; inspect the rendered element when a copied value seems to have no effect.

Check an opaque foreground/background pair

WCAG 2.2's Contrast (Minimum) criterion requires at least 4.5:1 for ordinary text and 3:1 for large text, subject to its stated exceptions. Large text means at least 18 point, or 14 point bold. The ratio is a luminance calculation, so choosing different hues alone does not ensure readable text.

The calculation uses WCAG relative luminance for opaque sRGB colors and compares the unrounded ratio with the thresholds. A result is a check of this color pair, not a complete accessibility assessment. For translucent text, images, gradients, hover states, or overlays, establish the final rendered background and check the affected states separately. Retain underlines, labels, or symbols where color conveys meaning.

The 216-color web-safe palette

This historical palette combines six values per channel: 00, 33, 66, 99, CC, and FF, equivalent to 0, 51, 102, 153, 204, and 255. Six choices for each of three channels give 6 × 6 × 6 = 216 colors. It addressed limited-color display environments; current CSS sRGB hex notation supports all 256 values per channel.

Expand a red-channel group to see copyable hex values. Swatches are visual aids; each value is also ordinary selectable text. To look up names such as teal or cornflowerblue, use the separate CSS named-color reference.

Red channel 0 (hex 00) — 36 colors

#000000

#000033

#000066

#000099

#0000CC

#0000FF

#003300

#003333

#003366

#003399

#0033CC

#0033FF

#006600

#006633

#006666

#006699

#0066CC

#0066FF

#009900

#009933

#009966

#009999

#0099CC

#0099FF

#00CC00

#00CC33

#00CC66

#00CC99

#00CCCC

#00CCFF

#00FF00

#00FF33

#00FF66

#00FF99

#00FFCC

#00FFFF

Red channel 51 (hex 33) — 36 colors

#330000

#330033

#330066

#330099

#3300CC

#3300FF

#333300

#333333

#333366

#333399

#3333CC

#3333FF

#336600

#336633

#336666

#336699

#3366CC

#3366FF

#339900

#339933

#339966

#339999

#3399CC

#3399FF

#33CC00

#33CC33

#33CC66

#33CC99

#33CCCC

#33CCFF

#33FF00

#33FF33

#33FF66

#33FF99

#33FFCC

#33FFFF

Red channel 102 (hex 66) — 36 colors

#660000

#660033

#660066

#660099

#6600CC

#6600FF

#663300

#663333

#663366

#663399

#6633CC

#6633FF

#666600

#666633

#666666

#666699

#6666CC

#6666FF

#669900

#669933

#669966

#669999

#6699CC

#6699FF

#66CC00

#66CC33

#66CC66

#66CC99

#66CCCC

#66CCFF

#66FF00

#66FF33

#66FF66

#66FF99

#66FFCC

#66FFFF

Red channel 153 (hex 99) — 36 colors

#990000

#990033

#990066

#990099

#9900CC

#9900FF

#993300

#993333

#993366

#993399

#9933CC

#9933FF

#996600

#996633

#996666

#996699

#9966CC

#9966FF

#999900

#999933

#999966

#999999

#9999CC

#9999FF

#99CC00

#99CC33

#99CC66

#99CC99

#99CCCC

#99CCFF

#99FF00

#99FF33

#99FF66

#99FF99

#99FFCC

#99FFFF

Red channel 204 (hex CC) — 36 colors

#CC0000

#CC0033

#CC0066

#CC0099

#CC00CC

#CC00FF

#CC3300

#CC3333

#CC3366

#CC3399

#CC33CC

#CC33FF

#CC6600

#CC6633

#CC6666

#CC6699

#CC66CC

#CC66FF

#CC9900

#CC9933

#CC9966

#CC9999

#CC99CC

#CC99FF

#CCCC00

#CCCC33

#CCCC66

#CCCC99

#CCCCCC

#CCCCFF

#CCFF00

#CCFF33

#CCFF66

#CCFF99

#CCFFCC

#CCFFFF

Red channel 255 (hex FF) — 36 colors

#FF0000

#FF0033

#FF0066

#FF0099

#FF00CC

#FF00FF

#FF3300

#FF3333

#FF3366

#FF3399

#FF33CC

#FF33FF

#FF6600

#FF6633

#FF6666

#FF6699

#FF66CC

#FF66FF

#FF9900

#FF9933

#FF9966

#FF9999

#FF99CC

#FF99FF

#FFCC00

#FFCC33

#FFCC66

#FFCC99

#FFCCCC

#FFCCFF

#FFFF00

#FFFF33

#FFFF66

#FFFF99

#FFFFCC

#FFFFFF

Explore all Web Work guides