CodeBodger Home

HTML Color Chart

Hints and Tips

  • UltraSafe16 - The sixteen standard colors defined by HTML 4.0. All color capable browsers can show these without dithering. Even monochrome users should be able to see these in distinct shades of gray. Stick to these colors for text documents, and all users will have access. There is even a good case for using no colors in pure text documents, and allowing the browser to use the users default colors.

  • Standard 216 - The 216 colors which can be shown by systems with a 256 color display. The majority of users have at least a 256 color display, and these colors will display without dithering. Use these for simple background colors, text and links as dithered text can be very hard to read. Try and stick to these colors in gifs, for a consistent look.

  • The Full Color Range. Some sites are highly graphically orientated and are justified in using the full range of colors for images. Even so, there is often very little justification for using odd colors ouside the images.

  • Use color values NOT names!
    Color names should be fully supported in modern browsers. IE5 fails on lightgray, but not lightgrey! (gray may be spelled either way.) Opera v5.2 fails on fourteen names. Not bad given Opera's strict adherence to standards!

  • Your natty red text on a green background could be invisible to those who are Red-Green colorblind.

  • The subtle lightgrey text on the off-white background needs good eyesight, and may disappear if the contrast is turned down - not all viewers are using your monitor settings.

  • That bright pink background may be striking on a 14" monitor, and blinding on a 22".
    (Hint... Put the page into a centered single cell table, restrict its width, and color the table background, leaving the body a neutral color.

  • If using light text on a dark textured background, try using bold text, if often improves readability.

  • Be consistent. Decide on a color scheme and stick to it.

  • If in doubt, tone it down. The bright, hyperactive look can quickly become irritating. The dull and boring scheme becomes comfortable. Remember it is the content that counts, and color is there to complement not compete.

  • Come back next week. If it looks as good now, as when you first saw it, you have a winner.

UltraSafe 16




aqua
#00FFFF

 gray
#808080

 navy
#000080

 silver
#C0C0C0

 black
#000000

 green
#008000






olive
#808000

 teal
#008080

 blue
#0000FF

 lime
#00FF00

 purple
#800080

 yellow
#FFFF00




fuchsia
#FF00FF

 maroon
#800000

 red
#FF0000

 white
#FFFFFF

Standard 216 Blues




azure
#F0FFFF

 aliceblue
#F0F8FF

 lavender
#E6E6FA

 lightcyan
#E0FFFF

 powderblue
#B0E0E6

 lightsteelblue
#B0C4DE






paleturquoise
#AFEEEE

 lightblue
#ADD8E6

 blueviolet
#8A2BE2

 lightskyblue
#87CEFA

 skyblue
#87CEEB

 mediumslateblue
#7B68EE






slateblue
#6A6ACD

 cornflowerblue
#6495ED

 cadetblue
#5F9EA0

 indigo
#4B0082

 mediumturquoise
#48D1CC

 darkslateblue
#483D8B






steelblue
#4682B4

 royalblue
#4169E1

 turquoise
#40E0D0

 dodgerblue
#1E90FF

 midnightblue
#191970

 aqua
#00FFFF






cyan
#00FFFF

 darkturquoise
#00CED1

 deepskyblue
#00BFFF

 darkcyan
#008B8B

 blue
#0000FF

 mediumblue
#0000CD


darkblue
#00008B

 navy
#000080

Standard 216 Greens




mintcream
#F5FFFA

 honeydew
#F0FFF0

 greenyellow
#ADFF2F

 yellowgreen
#9ACD32

 palegreen
#98FB98

 lightgreen
#90EE90






darkseagreen
#8FBC8F

 olive
#808000

 aquamarine
#7FFFD4

 chartreuse
#7FFF00

 lawngreen
#7CFC00

 olivedrab
#6B8E23






mediumaquamarine
#66CDAA

 darkolivegreen
#556B2F

 mediumseagreen
#3CB371

 limegreen
#32CD32

 seagreen
#2E8B57

 forestgreen
#228B22






lightseagreen
#20B2AA

 springgreen
#00FF7F

 lime
#00FF00

 mediumspringgreen
#00FA9A

 teal
#008080

 green
#008000

darkgreen
#006400

Standard 216 Reds




lavenderblush
#FFF0F5

 mistyrose
#FFE4E1

 pink
#FFC0CB

 lightpink
#FFB6C1

 orange
#FFA500

 lightsalmon
#FFA07A






darkorange
#FF8C00

 coral
#FF7F50

 hotpink
#FF69B4

 tomato
#FF6347

 orangered
#FF4500

 deeppink
#FF1493






fuchsia
#FF00FF

 magenta
#FF00FF

 red
#FF0000

 salmon
#FA8072

 lightcoral
#F08080

 violet
#EE82EE






darksalmon
#E9967A

 plum
#DDA0DD

 crimson
#DC143C

 palevioletred
#DB7093

 orchid
#DA70D6

 thistle
#D8BFD8






indianred
#DC5C5C

 mediumvioletred
#C71585

 mediumorchid
#BA55D3

 firebrick
#B22222

 darkorchid
#9932CC

 darkviolet
#9400D3





mediumpurple
#9370DB

 darkmagenta
#8B008B

 darkred
#8B0000

 purple
#800080

 maroon
#800000

Standard 216 Yellows




ivory
#FFFFF0

 lightyellow
#FFFFE0

 yellow
#FFFF00

 floralwhite
#FFFAF0

 lemonchiffon
#FFFACD

 cornsilk
#FFF8DC



gold
#FFD700

 khaki
#F0E68C

 darkkhaki
#BDB76B

Standard 216 Browns




snow
#FFFAFA

 seashell
#FFF5EE

 papayawhip
#FFEFD5

 blanchedalmond
#FFEBCD

 bisque
#FFE4C4

 moccasin
#FFE4B5






navajowhite
#FFDEAD

 peachpuff
#FFDAB9

 oldlace
#FDF5E6

 linen
#FAF0E6

 antiquewhite
#FAEBD7

 beige
#F5F5DC






wheat
#F5DEB3

 sandybrown
#F4A460

 palegoldenrod
#EEE8AA

 burlywood
#DEB887

 goldenrod
#DAA520

 tan
#D2B48C






chocolate
#D2691E

 peru
#CD853F

 rosybrown
#BC8F8F

 darkgoldenrod
#B8860B

 brown
#A52A2A

 sienna
#A0522D

saddlebrown
#8B4513

Standard 216 Grays




white
#FFFFFF

 ghostwhite
#F8F8FF

 whitesmoke
#F5F5F5

 gainsboro
#DCDCDC

 lightgray
#D3D3D3

 silver
#C0C0C0






darkgray
#A9A9A9

 gray
#808080

 lightslategray
#778899

 slategray
#708090

 dimgray
#696969

 darkslategray
#2F4F4F

black
#000000