Apresentamos uma tabela para ser usada como ferramenta em HTML e CSS, onde aparecem amostras de cores em células razoavelmente grandes para melhor visualização.
São 504 amostras.
| Seção 1 - Cores cujos nomes podem ser usados no lugar do código. O asterisco indica tratar-se de cor oficial. | voltar | ||||||||||
| AliceBlue #F0F8FF 240,248,255 CSW: não
| AntiqueWhite #FAEBD7 250,235,215 CSW: não
| * Aqua #00FFFF #0FF 0,255,255 CSW: sim | Aquamarine #7FFFD4 127,255,212 CSW: não
| ||||||||
| Azure #F0FFFF 240,255,255 CSW: não
| Beige #F5F5DC 245,245,220 CSW: não
| Bisque #FFE4C4 255,228,196 CSW: não
| * Black #000000 #000 0,0,0 CSW: sim | ||||||||
| BlanchedAlmond #FFEBCD 255,235,205 CSW: não
| * Blue #0000FF #00F 0,0,255 CSW: sim | BlueViolet #8A2BE2 138,43,226 CSW: não
| Brown #A52A2A 165,42,42 CSW: não
| ||||||||
| BurlyWood #DEB887 222,184,135 CSW: não
| CadetBlue #5F9EA0 95,158,160 CSW: não
| Chartreuse #7FFF00 127,255,0 CSW: não
| Chocolate #D2691E 210,105,30 CSW: não
| ||||||||
| Coral #FF7F50 255,127,80 CSW: não
| CornflowerBlue #6495ED 100,149,237 CSW: não
| Cornsilk #FFF8DC 255,248,220 CSW: não
| Crimson #DC143C 220,20,60 CSW: não
| ||||||||
| Cyan #00FFFF #0FF 0,255,255 CSW: sim | DarkBlue #00008B 0,0,139 CSW: não
| DarkCyan #008B8B 0,139,139 CSW: não
| DarkGoldenRod #B8860B 184,134,11 CSW: não
| ||||||||
| DarkGray #A9A9A9 169,169,169 CSW: não
| DarkGreen #006400 0,100,0 CSW: não
| DarkKhaki #BDB76B 189,183,107 CSW: não
| DarkMagenta #8B008B 139,0,139 CSW: não
| ||||||||
| DarkOliveGreen #556B2F 85,107,47 CSW: não
| DarkOrange #FF8C00 255,140,0 CSW: não
| DarkOrchid #9932CC 153,50,204 CSW: não
| DarkRed #8B0000 139,0,0 CSW: não
| ||||||||
| DarkSalmon #E9967A 233,150,122 CSW: não
| DarkSeaGreen #8FBC8F 143,188,143 CSW: não
| DarkSlateBlue #483D8B 72,61,139 CSW: não
| DarkSlateGray #2F4F4F 47,79,79 CSW: não
| ||||||||
| DarkTurquoise #00CED1 0,206,209 CSW: não
| DarkViolet #9400D3 148,0,211 CSW: não
| DeepPink #FF1493 255,20,147 CSW: não
| DeepSkyBlue #00BFFF 0,191,255 CSW: não
| ||||||||
| DimGray #696969 105,105,105 CSW: não
| DodgerBlue #1E90FF 30,144,255 CSW: não
| Feldspar #D19275 209,146,117 CSW: não
| FireBrick #B22222 178,34,34 CSW: não
| ||||||||
| FloralWhite #FFFAF0 255,250,240 CSW: não
| ForestGreen #228B22 34,139,34 CSW: não
| * Fuchsia #FF00FF #F0F 255,0,255 CSW: sim | Gainsboro #DCDCDC 220,220,220 CSW: não
| ||||||||
| GhostWhite #F8F8FF 248,248,255 CSW: não
| Gold #FFD700 255,215,0 CSW: não
| GoldenRod #DAA520 218,165,32 CSW: não
| * Gray #808080 128,128,128 CSW: não
| ||||||||
| * Green #008000 0,128,0 CSW: não
| GreenYellow #ADFF2F 173,255,47 CSW: não
| HoneyDew #F0FFF0 240,255,240 CSW: não
| HotPink #FF69B4 255,105,180 CSW: não
| ||||||||
| IndianRed #CD5C5C 205,92,92 CSW: não
| Indigo #4B0082 75,0,130 CSW: não
| Ivory #FFFFF0 255,255,240 CSW: não
| Khaki #F0E68C 240,230,140 CSW: não
| ||||||||
| Lavender #E6E6FA 230,230,250 CSW: não
| LavenderBlush #FFF0F5 255,240,245 CSW: não
| LawnGreen #7CFC00 124,252,0 CSW: não
| LemonChiffon #FFFACD 255,250,205 CSW: não
| ||||||||
| LightBlue #ADD8E6 173,216,230 CSW: não
| LightCoral #F08080 240,128,128 CSW: não
| LightCyan #E0FFFF 224,255,255 CSW: não
| LightGoldenRodYellow #FAFAD2 250,250,210 CSW: não
| ||||||||
| LightGrey #D3D3D3 211,211,211 CSW: não
| LightGreen #90EE90 144,238,144 CSW: não
| LightPink #FFB6C1 255,182,193 CSW: não
| LightSalmon #FFA07A 255,160,122 CSW: não
| ||||||||
| LightSeaGreen #20B2AA 32,178,170 CSW: não
| LightSkyBlue #87CEFA 135,206,250 CSW: não
| LightSlateBlue #8470FF 132,112,255 CSW: não
| LightSlateGray #778899 #789 119,136,153 CSW: não
| ||||||||
| LightSteelBlue #B0C4DE 176,196,222 CSW: não
| LightYellow #FFFFE0 255,255,224 CSW: não
| * Lime #00FF00 #0F0 0,255,0 CSW: sim | LimeGreen #32CD32 50,205,50 CSW: não
| ||||||||
| Linen #FAF0E6 250,240,230 CSW: não
| Magenta #FF00FF #F0F 255,0,255 CSW: sim | * Maroon #800000 128,0,0 CSW: não
| MediumAquaMarine #66CDAA 102,205,170 CSW: não
| ||||||||
| MediumBlue #0000CD 0,0,205 CSW: não
| MediumOrchid #BA55D3 186,85,211 CSW: não
| MediumPurple #9370D8 147,112,216 CSW: não
| MediumSeaGreen #3CB371 60,179,113 CSW: não
| ||||||||
| MediumSlateBlue #7B68EE 123,104,238 CSW: não
| MediumSpringGreen #00FA9A 0,250,154 CSW: não
| MediumTurquoise #48D1CC 72,209,204 CSW: não
| MediumVioletRed #C71585 199,21,133 CSW: não
| ||||||||
| MidnightBlue #191970 25,25,112 CSW: não
| MintCream #F5FFFA 245,255,250 CSW: não
| MistyRose #FFE4E1 255,228,225 CSW: não
| Moccasin #FFE4B5 255,228,181 CSW: não
| ||||||||
| NavajoWhite #FFDEAD 255,222,173 CSW: não
| * Navy #000080 0,0,128 CSW: não
| OldLace #FDF5E6 253,245,230 CSW: não
| * Olive #808000 128,128,0 CSW: não
| ||||||||
| OliveDrab #6B8E23 107,142,35 CSW: não
| * Orange #FFA500 255,165,0 CSW: não
| OrangeRed #FF4500 255,69,0 CSW: não
| Orchid #DA70D6 218,112,214 CSW: não
| ||||||||
| PaleGoldenRod #EEE8AA 238,232,170 CSW: não
| PaleGreen #98FB98 152,251,152 CSW: não
| PaleTurquoise #AFEEEE 175,238,238 CSW: não
| PaleVioletRed #D87093 216,112,147 CSW: não
| ||||||||
| PapayaWhip #FFEFD5 255,239,213 CSW: não
| PeachPuff #FFDAB9 255,218,185 CSW: não
| Peru #CD853F 205,133,63 CSW: não
| Pink #FFC0CB 255,192,203 CSW: não
| ||||||||
| Plum #DDA0DD 221,160,221 CSW: não
| PowderBlue #B0E0E6 176,224,230 CSW: não
| * Purple #800080 128,0,128 CSW: não
| * Red #FF0000 #F00 255,0,0 CSW: sim | ||||||||
| RosyBrown #BC8F8F 188,143,143 CSW: não
| RoyalBlue #4169E1 65,105,225 CSW: não
| SaddleBrown #8B4513 139,69,19 CSW: não
| Salmon #FA8072 250,128,114 CSW: não
| ||||||||
| SandyBrown #F4A460 244,164,96 CSW: não
| SeaGreen #2E8B57 46,139,87 CSW: não
| SeaShell #FFF5EE 255,245,238 CSW: não
| Sienna #A0522D 160,82,45 CSW: não
| ||||||||
| * Silver #C0C0C0 192,192,192 CSW: não
| SkyBlue #87CEEB 135,206,235 CSW: não
| SlateBlue #6A5ACD 106,90,205 CSW: não
| SlateGray #708090 112,128,144 CSW: não
| ||||||||
| Snow #FFFAFA 255,250,250 CSW: não
| SpringGreen #00FF7F 0,255,127 CSW: não
| SteelBlue #4682B4 70,130,180 CSW: não
| Tan #D2B48C 210,180,140 CSW: não
| ||||||||
| * Teal #008080 0,128,128 CSW: não
| Thistle #D8BFD8 216,191,216 CSW: não
| Tomato #FF6347 255,99,71 CSW: não
| Turquoise #40E0D0 64,224,208 CSW: não
| ||||||||
| Violet #EE82EE 238,130,238 CSW: não
| VioletRed #D02090 208,32,144 CSW: não
| Wheat #F5DEB3 245,222,179 CSW: não
| * White #FFFFFF #FFF 255,255,255 CSW: sim | ||||||||
| WhiteSmoke #F5F5F5 245,245,245 CSW: não
| * Yellow #FFFF00 #FF0 255,255,0 CSW: sim | YellowGreen #9ACD32 154,205,50 CSW: não
| * Black #000000 #000 0,0,0 CSW: sim | ||||||||
| Seção 2 - Algumas cores cujos nomes em português são conhecidos | voltar | ||||||||||
| Laranja ou cor-de-abóbora #FFC800 255,200,0 CSW: não
| Carmim #FF78C7 255,120,199 CSW: não
| Vermelho-indiano #CD5C5C 205,92,92 CSW: não
| Marrom-claro #A52A2A 165,42,42 CSW: não
| ||||||||
| Rosa ou cor-de-rosa #FFC8D7 255,200,215 CSW: não
| Índigo ou anil #000099 #009 0,0,153 CSW: sim | Violeta ou lilás #CC99FF #C9F 204,153,255 CSW: sim | Bege #FFF8D9 255,248,217 CSW: não
| ||||||||
| Ocre #6B521D 107,82,29 CSW: não
| Grená #CC3399 #C39 204,51,153 CSW: sim | Salmão #FFB2AD 255,178,173 CSW: não
| Coral #FF9600 255,150,0 CSW: não
| ||||||||
| Pardo #EFD66D 239,214,109 CSW: não
| Cáqui #9F9F5F 159,159,95 CSW: não
| Azul-marinho #0066CC #06C 0,102,204 CSW: sim | Ciano-escuro ou ciano-petróleo #00C4C4 0,196,196 CSW: não
| ||||||||
| Verde-oliva #B9C300 185,195,0 CSW: não
| Turquesa #40E0D0 64,224,208 CSW: não
| Vinho #993366 #936 153,51,102 CSW: sim | Azul-celeste #33CCFF #3CF 51,204,255 CSW: sim | ||||||||
| Seçao 3 - Gradações - I | voltar | ||||||||||
| #E6E8FA 230,232,250 CSW: não
| #FFCCCC #FCC 255,204,204 CSW: sim | #FFCC99 #FC9 255,204,153 CSW: sim | #FFFFCC #FFC 255,255,204 CSW: sim | ||||||||
| #D9D9F3 217,217,243 CSW: não
| #FF6666 #F66 255,102,102 CSW: sim | #FFCC33 #FC3 255,204,51 CSW: sim | #FFFF99 #FF9 255,255,153 CSW: sim | ||||||||
| #CDC5BF 205,197,191 CSW: não
| #FF0000 #F00 255,0,0 CSW: sim | #FF9900 #F90 255,153,0 CSW: sim | #FFFF00 #FF0 255,255,0 CSW: sim | ||||||||
| #CCCCCC #CCC 204,204,204 CSW: sim | #CC0000 #C00 204,0,0 CSW: sim | #FF6600 #F60 255,102,0 CSW: sim | #FFCC00 #FC0 255,204,0 CSW: sim | ||||||||
| #999999 #999 153,153,153 CSW: sim | #990000 #900 153,0,0 CSW: sim | #CC6600 #C60 204,102,0 CSW: sim | #999900 #990 153,153,0 CSW: sim | ||||||||
| #666666 #666 102,102,102 CSW: sim | #660000 #600 102,0,0 CSW: sim | #993300 #930 153,51,0 CSW: sim | #666600 #660 102,102,0 CSW: sim | ||||||||
| #333333 #333 51,51,51 CSW: sim | #330000 #300 51,0,0 CSW: sim | #663300 #630 102,51,0 CSW: sim | #333300 #330 51,51,0 CSW: sim | ||||||||
| Seção 4 - Gradações - II | voltar | ||||||||||
| #99FF99 #9F9 153,255,153 CSW: sim | #CCFFFF #CFF 204,255,255 CSW: sim | #FFCCFF #FCF 255,204,255 CSW: sim | #FFFFED 255,255,237 CSW: não
| ||||||||
| #66FF99 #6F9 102,255,153 CSW: sim | #66FFFF #6FF 102,255,255 CSW: sim | #FF99FF #F9F 255,153,255 CSW: sim | #FFFFCC #FFC 255,255,204 CSW: sim | ||||||||
| #33FF33 #3F3 51,255,51 CSW: sim | #33CCFF #3CF 51,204,255 CSW: sim | #CC66CC #C6C 204,102,204 CSW: sim | #FFFFAA #FFA 255,255,170 CSW: não
| ||||||||
| #00CC00 #0C0 0,204,0 CSW: sim | #3366FF #36F 51,102,255 CSW: sim | #CC33CC #C3C 204,51,204 CSW: sim | #FFFF90 255,255,144 CSW: não
| ||||||||
| #009900 #090 0,153,0 CSW: sim | #3333FF #33F 51,51,255 CSW: sim | #993366 #936 153,51,102 CSW: sim | #FFFF80 255,255,128 CSW: não
| ||||||||
| #006600 #060 0,102,0 CSW: sim | #000099 #009 0,0,153 CSW: sim | #663366 #636 102,51,102 CSW: sim | #FFFF66 #FF6 255,255,102 CSW: sim | ||||||||
| #003300 #030 0,51,0 CSW: sim | #000066 #006 0,0,102 CSW: sim | #330033 #303 51,0,51 CSW: sim | #FFFF33 #FF3 255,255,51 CSW: sim | ||||||||
| Seção 5 - Tonalidades de Verde | voltar | ||||||||||
| Aquamarine #70DB93 112,219,147 CSW: não
| Forest Green #238E23 35,142,35 CSW: não
| Green Yellow #93DB70 147,219,112 CSW: não
| Spring Green #00FF7F 0,255,127 CSW: não
| ||||||||
| Dark Green #006400 0,100,0 CSW: não
| Dark Green Copper #646937 100,105,55 CSW: não
| Green Copper #466464 70,100,100 CSW: não
| Hunter Green #215E21 33,94,33 CSW: não
| ||||||||
| Medium Spring Green #7FFF00 127,255,0 CSW: não
| Medium Sea Green #426F42 66,111,66 CSW: não
| Medium Forest Green #6B8E23 107,142,35 CSW: não
| Sea Green #238E68 35,142,104 CSW: não
| ||||||||
| Seção 6 - Tonalidades de marrom | voltar | ||||||||||
| Baker's Chocolate #5C3317 92,51,23 CSW: não
| Dark Brown #5C4033 92,64,51 CSW: não
| Brown #A62A2A 166,42,42 CSW: não
| Dark Tan #97694F 151,105,79 CSW: não
| ||||||||
| Light Wood #E9C2A6 233,194,166 CSW: não
| Dark Wood #855E42 133,94,66 CSW: não
| Feldspar #D19275 209,146,117 CSW: não
| Firebrick #8E2323 142,35,35 CSW: não
| ||||||||
| Medium Wood #A67A64 166,122,100 CSW: não
| New Tan #EBC79E 235,199,158 CSW: não
| Semi-Sweet Chocolate #6B4226 107,66,38 CSW: não
| Sienna #8E6B23 142,107,35 CSW: não
| ||||||||
| Seção 7 - Tonalidades de Violeta | voltar | ||||||||||
| Blue Violet #9F5F9F 159,95,159 CSW: não
| Dark Orchid #9932CD 153,50,205 CSW: não
| Dark Purple #871F78 135,31,120 CSW: não
| Violet #EE82EE 238,130,238 CSW: não
| ||||||||
| Medium Violet Red #DB7093 219,112,147 CSW: não
| Neon Pink #FF6EC7 255,110,199 CSW: não
| Plum #DDA0DD 221,160,221 CSW: não
| Blue Violet #8A2BE2 138,43,226 CSW: não
| ||||||||
| Dark Violet #9400D3 148,0,211 CSW: não
| Spicy Pink #FF1CAE 255,28,174 CSW: não
| Violet Red #CC3299 204,50,153 CSW: não
| Orchid #DA70D6 218,112,214 CSW: não
| ||||||||
| Seção 8 - Tonalidades de Amarelo | voltar | ||||||||||
| Brass #B5A642 181,166,66 CSW: não
| Bright Gold #D9D919 217,217,25 CSW: não
| Papaya Whip #FFEFD5 255,239,213 CSW: não
| Bronze #A67D3D 166,125,61 CSW: não
| ||||||||
| Cool Copper #D98719 217,135,25 CSW: não
| Copper #B87333 184,115,51 CSW: não
| Gold #CD7F32 205,127,50 CSW: não
| Bisque #FFE4C4 255,228,196 CSW: não
| ||||||||
| Goldenrod #DBDB70 219,219,112 CSW: não
| Mandarian Orange #E47833 228,120,51 CSW: não
| Medium Goldenrod #EAEAAE 234,234,174 CSW: não
| Old Gold #CFB53B 207,181,59 CSW: não
| ||||||||
| Dark Orange #FF8C00 255,140,0 CSW: não
| Cornsilk #FFF8DC 255,248,220 CSW: não
| Navajo White #FFDEAD 255,222,173 CSW: não
| Wheat #D8D8BF 216,216,191 CSW: não
| ||||||||
| Seção 9 - Tonalidades de Azul | voltar | ||||||||||
| Corn Flower Blue #42426F 66,66,111 CSW: não
| Sky Blue #87CEFF 135,206,255 CSW: não
| Dark Turquoise #7093DB 112,147,219 CSW: não
| Light Blue #C0D9D9 192,217,217 CSW: não
| ||||||||
| Light Steel Blue #8F8FBD 143,143,189 CSW: não
| Medium Blue #3232CD 50,50,205 CSW: não
| Medium Slate Blue #7F00FF 127,0,255 CSW: não
| Royal Blue #4169E1 65,105,225 CSW: não
| ||||||||
| Neon Blue #4D4DFF 77,77,255 CSW: não
| New Midnight Blue #00009C 0,0,156 CSW: não
| Dodger Blue #1E90FF 30,144,255 CSW: não
| Rich Blue #5959AB 89,89,171 CSW: não
| ||||||||
| Slate Blue #007FFF 0,127,255 CSW: não
| Deep Sky Blue #00BFFF 0,191,255 CSW: não
| Steel Blue #236B8E 35,107,142 CSW: não
| Summer Sky #38B0DE 56,176,222 CSW: não
| ||||||||
| Seção 10 - As 216 Cores Seguras da Web | voltar | ||||
| #000000 #000 0,0,0 | #000033 #003 0,0,51 | #000066 #006 0,0,102 | #000099 #009 0,0,153 | #0000CC #00C 0,0,204 | #0000FF #00F 0,0,255 |
| #003300 #030 0,51,0 | #003333 #033 0,51,51 | #003366 #036 0,51,102 | #003399 #039 0,51,153 | #0033CC #03C 0,51,204 | #0033FF #03F 0,51,255 |
| #006600 #060 0,102,0 | #006633 #063 0,102,51 | #006666 #066 0,102,102 | #006699 #069 0,102,153 | #0066CC #06C 0,102,204 | #0066FF #06F 0,102,255 |
| #009900 #090 0,153,0 | #009933 #093 0,153,51 | #009966 #096 0,153,102 | #009999 #099 0,153,153 | #0099CC #09C 0,153,204 | #0099FF #09F 0,153,255 |
| #00CC00 #0C0 0,204,0 | #00CC33 #0C3 0,204,51 | #00CC66 #0C6 0,204,102 | #00CC99 #0C9 0,204,153 | #00CCCC #0CC 0,204,204 | #00CCFF #0CF 0,204,255 |
| #00FF00 #0F0 0,255,0 | #00FF33 #0F3 0,255,51 | #00FF66 #0F6 0,255,102 | #00FF99 #0F9 0,255,153 | #00FFCC #0FC 0,255,204 | #00FFFF #0FF 0,255,255 |
| #330000 #300 51,0,0 | #330033 #303 51,0,51 | #330066 #306 51,0,102 | #330099 #309 51,0,153 | #3300CC #30C 51,0,204 | #3300FF #30F 51,0,255 |
| #333300 #330 51,51,0 | #333333 #333 51,51,51 | #333366 #336 51,51,102 | #333399 #339 51,51,153 | #3333CC #33C 51,51,204 | #3333FF #33F 51,51,255 |
| #336600 #360 51,102,0 | #336633 #363 51,102,51 | #336666 #366 51,102,102 | #336699 #369 51,102,153 | #3366CC #36C 51,102,204 | #3366FF #36F 51,102,255 |
| #339900 #390 51,153,0 | #339933 #393 51,153,51 | #339966 #396 51,153,102 | #339999 #399 51,153,153 | #3399CC #39C 51,153,204 | #3399FF #39F 51,153,255 |
| #33CC00 #3C0 51,204,0 | #33CC33 #3C3 51,204,51 | #33CC66 #3C6 51,204,102 | #33CC99 #3C9 51,204,153 | #33CCCC #3CC 51,204,204 | #33CCFF #3CF 51,204,255 |
| #33FF00 #3F0 51,255,0 | #33FF33 #3F3 51,255,51 | #33FF66 #3F6 51,255,102 | #33FF99 #3F9 51,255,153 | #33FFCC #3FC 51,255,204 | #33FFFF #3FF 51,255,255 |
| #660000 #600 102,0,0 | #660033 #603 102,0,51 | #660066 #606 102,0,102 | #660099 #609 102,0,153 | #6600CC #60C 102,0,204 | #6600FF #60F 102,0,255 |
| #663300 #630 102,51,0 | #663333 #633 102,51,51 | #663366 #636 102,51,102 | #663399 #639 102,51,153 | #6633CC #63C 102,51,204 | #6633FF #63F 102,51,255 |
| #666600 #660 102,102,0 | #666633 #663 102,102,51 | #666666 #666 102,102,102 | #666699 #669 102,102,153 | #6666CC #66C 102,102,204 | #6666FF #66F 102,102,255 |
| #669900 #690 102,153,0 | #669933 #693 102,153,51 | #669966 #696 102,153,102 | #669999 #699 102,153,153 | #6699CC #69C 102,153,204 | #6699FF #69F 102,153,255 |
| #66CC00 #6C0 102,204,0 | #66CC33 #6C3 102,204,51 | #66CC66 #6C6 102,204,102 | #66CC99 #6C9 102,204,153 | #66CCCC #6CC 102,204,204 | #66CCFF #6CF 102,204,255 |
| #66FF00 #6F0 102,255,0 | #66FF33 #6F3 102,255,51 | #66FF66 #6F6 102,255,102 | #66FF99 #6F9 102,255,153 | #66FFCC #6FC 102,255,204 | #66FFFF #6FF 102,255,255 |
| #990000 #900 153,0,0 | #990033 #903 153,0,51 | #990066 #906 153,0,102 | #990099 #909 153,0,153 | #9900CC #90C 153,0,204 | #9900FF #90F 153,0,255 |
| #993300 #930 153,51,0 | #993333 #933 153,51,51 | #993366 #936 153,51,102 | #993399 #939 153,51,153 | #9933CC #93C 153,51,204 | #9933FF #93F 153,51,255 |
| #996600 #960 153,102,0 | #996633 #963 153,102,51 | #996666 #966 153,102,102 | #996699 #969 153,102,153 | #9966CC #96C 153,102,204 | #9966FF #96F 153,102,255 |
| #999900 #990 153,153,0 | #999933 #993 153,153,51 | #999966 #996 153,153,102 | #999999 #999 153,153,153 | #9999CC #99C 153,153,204 | #9999FF #99F 153,153,255 |
| #99CC00 #9C0 153,204,0 | #99CC33 #9C3 153,204,51 | #99CC66 #9C6 153,204,102 | #99CC99 #9C9 153,204,153 | #99CCCC #9CC 153,204,204 | #99CCFF #9CF 153,204,255 |
| #99FF00 #9F0 153,255,0 | #99FF33 #9F3 153,255,51 | #99FF66 #9F6 153,255,102 | #99FF99 #9F9 153,255,153 | #99FFCC #9FC 153,255,204 | #99FFFF #9FF 153,255,255 |
| #CC0000 #C00 204,0,0 | #CC0033 #C03 204,0,51 | #CC0066 #C06 204,0,102 | #CC0099 #C09 204,0,153 | #CC00CC #C0C 204,0,204 | #CC00FF #C0F 204,0,255 |
| #CC3300 #C30 204,51,0 | #CC3333 #C33 204,51,51 | #CC3366 #C36 204,51,102 | #CC3399 #C39 204,51,153 | #CC33CC #C3C 204,51,204 | #CC33FF #C3F 204,51,255 |
| #CC6600 #C60 204,102,0 | #CC6633 #C63 204,102,51 | #CC6666 #C66 204,102,102 | #CC6699 #C69 204,102,153 | #CC66CC #C6C 204,102,204 | #CC66FF #C6F 204,102,255 |
| #CC9900 #C90 204,153,0 | #CC9933 #C93 204,153,51 | #CC9966 #C96 204,153,102 | #CC9999 #C99 204,153,153 | #CC99CC #C9C 204,153,204 | #CC99FF #C9F 204,153,255 |
| #CCCC00 #CC0 204,204,0 | #CCCC33 #CC3 204,204,51 | #CCCC66 #CC6 204,204,102 | #CCCC99 #CC9 204,204,153 | #CCCCCC #CCC 204,204,204 | #CCCCFF #CCF 204,204,255 |
| #CCFF00 #CF0 204,255,0 | #CCFF33 #CF3 204,255,51 | #CCFF66 #CF6 204,255,102 | #CCFF99 #CF9 204,255,153 | #CCFFCC #CFC 204,255,204 | #CCFFFF #CFF 204,255,255 |
| #FF0000 #F00 255,0,0 | #FF0033 #F03 255,0,51 | #FF0066 #F06 255,0,102 | #FF0099 #F09 255,0,153 | #FF00CC #F0C 255,0,204 | #FF00FF #F0F 255,0,255 |
| #FF3300 #F30 255,51,0 | #FF3333 #F33 255,51,51 | #FF3366 #F36 255,51,102 | #FF3399 #F39 255,51,153 | #FF33CC #F3C 255,51,204 | #FF33FF #F3F 255,51,255 |
| #FF6600 #F60 255,102,0 | #FF6633 #F63 255,102,51 | #FF6666 #F66 255,102,102 | #FF6699 #F69 255,102,153 | #FF66CC #F6C 255,102,204 | #FF66FF #F6F 255,102,255 |
| #FF9900 #F90 255,153,0 | #FF9933 #F93 255,153,51 | #FF9966 #F96 255,153,102 | #FF9999 #F99 255,153,153 | #FF99CC #F9C 255,153,204 | #FF99FF #F9F 255,153,255 |
| #FFCC00 #FC0 255,204,0 | #FFCC33 #FC3 255,204,51 | #FFCC66 #FC6 255,204,102 | #FFCC99 #FC9 255,204,153 | #FFCCCC #FCC 255,204,204 | #FFCCFF #FCF 255,204,255 |
| #FFFF00 #FF0 255,255,0 | #FFFF33 #FF3 255,255,51 | #FFFF66 #FF6 255,255,102 | #FFFF99 #FF9 255,255,153 | #FFFFCC #FFC 255,255,204 | #FFFFFF #FFF 255,255,255 |
| voltar | |||||
Entendendo a tabela
As cores figuram como fundo das diversas células da tabela e cada uma delas pode apresentar-se seguida das seguintes informações:
- nome;
- código RGB hexadecimal;
- código RGB hexadecimal abreviado;
- código RGB decimal;
- indicação se está contida no conjunto das Cores Seguras da Web (CSW: sim ou não).
- Código hexadecimal abreviado da cor CSW mais próxima, somente quando a indicação acima for "não".
Algumas cores apresentam-se sem nome e/ou sem o código hexadecimal abreviado (porque não é possível tê-lo).
A tabela está dividida em dez seções, sendo que na seção 10 estão listadas as 216 Cores Seguras da Web, portanto as duas últimas informações acima só se fazem necessárias nas seções de 1 a 9.
Os nomes das cores
Na primeira seção da tabela estão listadas 143 cores cujos nomes são reconhecidos pelos browsers principais, dentre elas as chamadas oficiais. Mas as oficiais são apenas 17 e estão assinaladas com um asterisco.
Quanto aos nomes mencionados em outras seções da tabela (em português ou inglês), são nomes usados na linguagem comum e, no lugar deles, temos de adotar o código.
O Código RGB Decimal
A sigla RGB significa Red, Green, Blue (Vermelho, Verde, Azul). Qualquer cor que aparece no monitor de seu computador é formada da mistura de certa quantidade de cada uma dessas três cores.
As quantidades podem ser representadas pelos números decimais de 0 a 255, ou seja, 256 quantidades. Combinando as 256 quantidades possíveis de vermelho, verde e azul, é possível obter até 16.777.216 cores diferentes (256 x 256 x 256).
Exemplos:
255,102,0
51,102,153
255,102,0
51,102,153
O primeiro dos exemplos acima refere-se a uma cor composta de mais vermelho (a maior quantidade possível), menos verde e nada de azul. Já no segundo exemplo temos mais verde que vermelho e mais azul que verde.
O Código RGB Hexadecimal
Vimos no tópico anterior a codificação das cores pelo sistema de numeração decimal (base 10). As cores podem também ser representadas por códigos formados por números hexadecimais (base 16).
Sabemos que para formar um número do sistema decimal utilizamos dez dígitos, os quais são: 0,1,2,3,4,5,6,7,8,9. Assim, ao formarmos, por exemplo, um número de dois dígitos, para o seu primeiro dígito temos 10 possibilidades e para o segundo também. É assim que funciona para números de qualquer quantidade de dígitos; são sempre dez possibilidades para cada dígito. Então, podemos chegar à conclusão que o maior número de dois dígitos no sistema decimal é 99 e o maior com três dígitos é 999 e assim por diante.
No sistema hexadecimal de numeração, temos de percorrer o mesmo raciocínio, só que utilizando 16 dígitos. São eles: 0,1,2,3,4,5,6,7,8,9,A,B,C,D,E,F. De maneira análoga, ao estabelecermos um número de dois dígitos, para o primeiro dígito e para o segundo temos 16 possibilidades. Agora também podemos chegar à conclusão que o maior número de dois dígitos no sistema hexadecimal é FF.
Assim como no sistema decimal nós utilizamos a faixa numérica de 0 a 255 na codificação, no sistema hexadecimal utilizamos a faixa numérica de 0 a FF. São 256 números em ambos os sistemas de numeração.
Não é nosso propósito nesta página nos aprofundarmos no assunto "sistemas de numeração", portanto não falaremos sobre como converter um número hexadecimal em um número decimal. Mas o que já foi dito até aqui já é suficiente para que você possa inferir que o número zero do sistema hexadecimal corresponde ao número zero do decimal e que o número FF do sistema hexadecimal corresponde ao número 255 do decimal.
| Hex | Dec |
| 00 | 0 |
| 08 | 8 |
| 80 | 128 |
| 9B | 155 |
| CD | 205 |
| FF | 255 |
Uma forma prática de converter um número de um sistema para outro é utilizando a calculadora do Windows, mas antes, no seu menu Exibir, dê um clique em Científica. Experimente usar essa calculadora para fazer as conversões exibidas ao lado.
Agora que já aprendemos um pouco sobre o sistema de numeração hexadecimal, vamos ao código das cores propriamente dito. Tomemos já de uma vez um exemplo:
- Nome da cor:Azul celeste
- Código Hexadecimal: #33CCFF
- Código Decimal: 51,204,255
Da mesma forma que o código decimal é formado por três números, o hexadecimal também o é. Só que no hexadecimal os números são justapostos (sempre com dois dígitos cada um). No caso do exemplo, temos os números 33, CC e FF. Se, com a calculadora do Windows, você fizer a conversão desses três números do sistema hexadecimal para o sistema decimal, terá como resposta os números 51, 204 e 255.
Note que o código hexadecimal será sempre precedido do símbolo # (tralha).
O Código RGB Hexadecimal Abreviado
Vimos que o código hexadecimal das cores é formado por 3 pares de dígitos. Vejamos alguns exemplos:
- #FF78C7
- #CD5C5C
- #FF00FF
- #CCFF99
Observemos os 4 exemplos acima. No exemplo 1, temos um par formado de dígitos iguais e cada um dos outros dois pares formado por dígitos diferentes. No exemplo 2, temos cada um de todos os pares com dígitos diferentes. Já nos exemplos 3 e 4, cada par é formado por dígitos iguais.
Para os exemplos 3 e 4 podemos utilizar o código abreviado, assim:
#F0F
#CF9
#CF9
O Browser vai saber que F é FF, 0 é 00, C é CC e 9 é 99. Note que para os exemplos 1 e 2 essa redução não é possível.
Como exprimir as cores em HTML e CSS
Existem várias formas de definir as cores em HTML e CSS.
Em HTML e CSS, podemos usar o nome da cor, o código hexadecimal no formato #rrggbb ou o código decimal no formato rgb(x,x,x). Neste último formato, x pode ser um número de 0 a 255 ou um percentual de 0% a 100%.
Em CSS podemos utilizar ainda o código hexadecimal reduzido.
- Exemplos com HTML:
- <body bgcolor="green">
- <body bgcolor="00ffff">
- <font color="ff0000">
- <font color="rdb(255,0,0)">
- <body bgcolor="rgb(0%,100%,0%)">
- Exemplos com CSS:
- {color: yellow}
- {background-color: silver}
- {background-color: #ccccff}
- {background-color: #ccf}
- {background-color: rgb(204,204,255)}
- {color:rgb(80%,20%,60%)}
Observação:
Somente aqueles nomes reconhecidos pelos brownsers (seção 1 da tabela) podem ser utilizados, inclusive os das 17 cores oficiais.
Somente aqueles nomes reconhecidos pelos brownsers (seção 1 da tabela) podem ser utilizados, inclusive os das 17 cores oficiais.
O que são Cores Seguras da Web
Atualmente os computadores são capazes de exibir simultaneamente milhões de cores em seus monitores. Mas até meados de 1990 não era assim. Naquela época os computadores só conseguiam exibir 256 cores. Isso obrigava os navegadores a trabalharem só com essa quantidade limitada de cores.
Dessa quantidade, os sistemas operacionais Windows e Macintosh reservaram cada um 20 cores para criar suas interfaces gráficas (40 no total). Assim restaram 216 para serem utilizadas com a garantia de que seriam exibidas tanto num sistema quanto no outro.
Essas 216 cores ficaram conhecidas como "Cores Seguras da Web" e são obtidas usando códigos formados com a combinação apenas dos números seguintes:
| Base 10: | 00 | 51 | 102 | 153 | 204 | 255 |
| Base 16: | 00 | 33 | 66 | 99 | CC | FF |
Já que os computadores modernos não mais possuem as limitaçoes mencionadas, precisamos ainda ter essa preocupação? Sim, porque hoje existem terminais móveis (em telefones móveis e em PDAs) que possuem paletas reduzidas.
Então, se queremos que nossa página seja exibida sem problemas também por esses dispositivos, devemos considerar isso.
É por esse motivo que, para cada cor que não se enquadra no conjunto das Cores Seguras da Web, incluimos a apresentação de uma cor alternativa que se enquadra. A informação aparece em código hexadecimal abreviado dentro de uma célula pequena que fica dentro da célula principal. Essa célula pequena aparece sem bordas e seu fundo tem a cor alternativa. Colocamos a célula pequena sem bordas para que fique bem evidenciada a diferença entre as duas cores. No geral, as cores obtidas são bem semelhantes, há algumas que até se esvaem sobre a outra cor. Mas há algumas que são razoavelmente destoantes.
O critério adotado foi o de substituir os números que compõem o código da cor pelos mais próximos, dentre os mencionados acima.
Mais cores, acesse o site:
Postar um comentário