HTML Color Charts

Originally published on May 28, 2016.
Last updated on June 18, 2016.

There is a lot of repetitive calculating and typing involved in making this page. Because of that, the color tables are being added only as I need them or as I have time. If there is one in particular you’d like added, let me know.

Predefined color names are specified like this:
AliceBlue
The HTML 4.01 and CSS 2.1 specifications predefined 140 color names. Predefined color names are supported in all major browsers.

RGB hex color values are specified like this:
#RRGGBB
where RR, GG and BB are two-digit hexadecimal integers between 00 and FF specifying the intensity of the red (RR), green (GG), and blue (BB) colors. Hexadecimal colors are supported in all major browsers.

RGB color values are specified like this:
rgb(red, green, blue)
The red, green, and blue values are specified by decimal integers between 0 and 255. RGB colors are supported in all major browsers.

HSL color values are specified like this:
hsl(hue, saturation, lightness)
Hue is a degree on the color wheel from 0 to 360: 0 is red, 120 is green, 240 is blue. Saturation is a color percentage: 0% means a shade of gray and 100% is the full color. Lightness is a percentage: 0% is black, 100% is white. HSL colors are supported in all major browsers.

Colors can be specified in any of the following ways (these four examples are equivalent):
background-color: AliceBlue;
background-color: #F0F8FF;
background-color: rgb(240, 248, 255);
background-color: hsl(208, 100%, 97%);

How to Read the Color Charts

The color charts are displayed like this:

. . . .
AliceBlue #F0F8FF rgb(240, 248, 255) hsl(208, 100%, 97%)
. . . . . . . . . . . . . . . . . . . . . .
FFF
FFF
F0F
8FF
E6F
3FF
CCE
7FF
B3D
BFF
99C
FFF
80C
3FF
66B
8FF
4DA
CFF
33A
0FF
1A9
4FF
008
8FF
007
AE6
006
DCC
005
FB3
005
299
004
480
003
666
002
94D
001
B33
000
E1A
000
000
100% 97% 95% 90% 85% 80% 75% 70% 65% 60% 55% 50% 45% 40% 35% 30% 25% 20% 15% 10% 5% 0%


The top row is the color displayed using each of the four specification methods. The second row shows how the color is specified in the cell above it.

The third row shows the lightness values for the base color (the color in the top row). The fourth row shows the RGB hex color value for the cell above it. (The six-digit hex value is shown split into two groups of three to keep the column widths manageable.) The fifth row shows the lightness percentage.

The Color Charts

AliceBlue

. . . .
AliceBlue #F0F8FF rgb(240, 248, 255) hsl(208, 100%, 97%)
. . . . . . . . . . . . . . . . . . . . . .
FFF
FFF
F0F
8FF
E6F
3FF
CCE
7FF
B3D
BFF
99C
FFF
80C
3FF
66B
8FF
4DA
CFF
33A
0FF
1A9
4FF
008
8FF
007
AE6
006
DCC
005
FB3
005
299
004
480
003
666
002
94D
001
B33
000
E1A
000
000
100% 97% 95% 90% 85% 80% 75% 70% 65% 60% 55% 50% 45% 40% 35% 30% 25% 20% 15% 10% 5% 0%

AntiqueWhite

. . . .
AntiqueWhite #FAEBD7 rgb(250, 235, 215) hsl(34, 78%, 91%)
. . . . . . . . . . . . . . . . . . . . . .
FFF
FFF
FCF
4E8
FAE
BD7
F9E
8D2
F7D
DBB
F4D
1A4
F1C
68E
EEB
A77
EBA
F60
E9A
449
E69
833
E38
D1C
CC7
F19
B67
116
9F6
314
885
411
714
60E
5B3
80B
442
A08
2D1
C06
170
E03
000
000
100% 95% 91% 90% 85% 80% 75% 70% 65% 60% 55% 50% 45% 40% 35% 30% 25% 20% 15% 10% 5% 0%

Aqua

Aquamarine

Azure

Beige

Bisque

Black

BlanchedAlmond

Blue

BlueViolet

Brown

BurlyWood

CadetBlue

Chartreuse

Chocolate

Coral

CornflowerBlue

Cornsilk

Crimson

Cyan

DarkBlue

DarkCyan

DarkGoldenRod

DarkGray / DarkGrey

DarkGreen

DarkKhaki

DarkMagenta

DarkOliveGreen

DarkOrange

DarkOrchid

DarkRed

DarkSalmon

DarkSeaGreen

DarkSlateBlue

DarkSlateGray / DarkSlateGrey

DarkTurquoise

DarkViolet

DeepPink

DeepSkyBlue

DimGray / DimGrey

DodgerBlue

FireBrick

FloralWhite

ForestGreen

. . . .
ForestGreen #228B22 rgb(34, 139, 34) hsl(120, 61%, 34%)
. . . . . . . . . . . . . . . . . . . . . .
FFF
FFF
EAF
AEA
D6F
5D6
C1F
0C1
ADE
BAD
98E
698
84E
184
6FD
C6F
5BD
75B
46D
246
32C
D32
2DB
92D
28A
428
239
023
228
B22
1E7
B1E
196
719
145
214
0F3
E0F
0A2
90A
051
505
000
000
100% 95% 90% 85% 80% 75% 70% 65% 60% 55% 50% 45% 40% 35% 34% 30% 25% 20% 15% 10% 5% 0%

Fuchsia

Gainsboro

GhostWhite

Gold

GoldenRod

Gray / Grey

Green

GreenYellow

HoneyDew

HotPink

IndianRed

Indigo

Ivory

Khaki

Lavender

LavenderBlush

LawnGreen

LemonChiffon

LightBlue

LightCoral

LightCyan

LightGoldenRodYellow

LightGray / LightGrey

LightGreen

LightPink

LightSalmon

LightSeaGreen

LightSkyBlue

LightSlateGray / LightSlateGrey

LightSteelBlue

LightYellow

Lime

LimeGreen

Linen

Magenta

Maroon

MediumAquaMarine

MediumBlue

MediumOrchid

MediumPurple

MediumSeaGreen

MediumSlateBlue

MediumSpringGreen

MediumTurquoise

MediumVioletRed

MidnightBlue

MintCream

MistyRose

Moccasin

NavajoWhite

Navy

OldLace

Olive

OliveDrab

Orange

OrangeRed

Orchid

PaleGoldenRod

PaleGreen

PaleTurquoise

PaleVioletRed

PapayaWhip

PeachPuff

Peru

Pink

Plum

PowderBlue

Purple

RebeccaPurple

. . . .
RebeccaPurple #663399 rgb(102, 51, 153) hsl(270, 50%, 40%)
. . . . . . . . . . . . . . . . . . . . . .
FFF
FFF
F2E
CF9
E6D
9F2
D9C
6EC
CCB
3E6
BF9
FDF
B38
CD9
A67
9D2
996
6CC
8C5
3C6
804
0BF
733
9AC
663
399
663
399
592
D86
4D2
673
402
060
331
94D
261
339
1A0
D26
0D0
613
000
000
100% 95% 90% 85% 80% 75% 70% 65% 60% 55% 50% 45% 40% 40% 35% 30% 25% 20% 15% 10% 5% 0%

Red

. . . .
Red #FF0000 rgb(255, 0, 0) hsl(0, 100%, 50%)
. . . . . . . . . . . . . . . . . . . . . .
FFF
FFF
FFE
6E6
FFC
CCC
FFB
3B3
FF9
999
FF8
080
FF6
666
FF4
D4D
FF3
333
FF1
A1A
FF0
000
FF0
000
E60
000
CC0
000
B30
000
990
000
800
000
660
000
4D0
000
330
000
1A0
000
000
000
100% 95% 90% 85% 80% 75% 70% 65% 60% 55% 50% 50% 45% 40% 35% 30% 25% 20% 15% 10% 5% 0%

RosyBrown

RoyalBlue

SaddleBrown

Salmon

SandyBrown

SeaGreen

SeaShell

Sienna

Silver

. . . .
Silver #C0C0C0 rgb(192, 192, 192) hsl(0, 0%, 75%)
. . . . . . . . . . . . . . . . . . . . . .
FFF
FFF
F2F
2F2
E6E
6E6
D9D
9D9
CCC
CCC
C0C
0C0
C0C
0C0
B3B
3B3
A6A
6A6
999
999
8C8
C8C
808
080
737
373
666
666
595
959
4D4
D4D
404
040
333
333
262
626
1A1
A1A
0D0
D0D
000
000
100% 95% 90% 85% 80% 75% 75% 70% 65% 60% 55% 50% 45% 40% 35% 30% 25% 20% 15% 10% 5% 0%

SkyBlue

SlateBlue

SlateGray / SlateGrey

Snow

SpringGreen

SteelBlue

Tan

. . . .
Tan #D2B48C rgb(210, 180, 140) hsl(34, 44%, 69%)
. . . . . . . . . . . . . . . . . . . . . .
FFF
FFF
F8F
3ED
F1E
7DA
EAD
BC8
E2C
FB6
DBC
3A3
D4B
791
D2B
48C
CDA
B7E
C69
F6C
BF9
35A
B88
747
A57
940
936
C39
815
E32
6E5
12B
5C4
324
493
61D
372
815
251
B0E
120
D07
000
000
100% 95% 90% 85% 80% 75% 70% 69% 65% 60% 55% 50% 45% 40% 35% 30% 25% 20% 15% 10% 5% 0%

Teal

Thistle

Tomato

Turquoise

Violet

Wheat

White

WhiteSmoke

Yellow

. . . .
Yellow #FFFF00 rgb(255, 255, 0) hsl(60, 100%, 50%)
. . . . . . . . . . . . . . . . . . . . . .
FFF
FFF
FFF
FE6
FFF
FCC
FFF
FB3
FFF
F99
FFF
F80
FFF
F66
FFF
F4D
FFF
F33
FFF
F1A
FFF
F00
FFF
F00
E6E
600
CCC
C00
B3B
300
999
900
808
000
666
600
4D4
D00
333
300
1A1
A00
000
000
100% 95% 90% 85% 80% 75% 70% 65% 60% 55% 50% 50% 45% 40% 35% 30% 25% 20% 15% 10% 5% 0%

YellowGreen

. . . .
YellowGreen #9ACD32 rgb(154, 205, 50) hsl(80, 61%, 50%)
. . . . . . . . . . . . . . . . . . . . . .
FFF
FFF
F5F
AEA
EBF
5D6
E1F
0C1
D6E
BAD
CCE
698
C2E
184
B8D
C6F
AED
75B
A4D
246
9AC
D32
9AC
D32
8AB
92D
7BA
428
6B9
023
5C7
B1E
4D6
719
3D5
214
2E3
E0F
1F2
90A
0F1
505
000
000
100% 95% 90% 85% 80% 75% 70% 65% 60% 55% 50% 50% 45% 40% 35% 30% 25% 20% 15% 10% 5% 0%

Leave a Reply