HEX, RGB(a) & HSL(a) are all great, but with can also use keyword names for 140 colors. Here's a reference for all of them, along with their HEX equivalent, in alphabetical order. Note that there's really 147 in there, but 7 of them have duplicates (grey and gray for example). Everything is included along with the new color names from CSS3 and <^>rebeccapurple<^> from CSS Color Level 4:

<table class="color-names"><thead><tr><th>Name</th><th>HEX</th><th style="width: 33%;">Color</th></tr></thead><tbody><tr><td>aliceblue</td><td>#F0F8FF</td><td style="background-color: aliceblue;"></td></tr><tr><td>antiquewhite</td><td>#FAEBD7</td><td style="background-color: antiquewhite;"></td></tr><tr><td>aqua</td><td>#00FFFF</td><td style="background-color: aqua;"></td></tr><tr><td>aquamarine</td><td>#7FFFD4</td><td style="background-color: aquamarine;"></td></tr><tr><td>azure</td><td>#F0FFFF</td><td style="background-color: azure;"></td></tr><tr><td>beige</td><td>#F5F5DC</td><td style="background-color: beige;"></td></tr><tr><td>bisque</td><td>#FFE4C4</td><td style="background-color: bisque;"></td></tr><tr><td>black</td><td>#000000</td><td style="background-color: black;"></td></tr><tr><td>blanchedalmond</td><td>#FFEBCD</td><td style="background-color: blanchedalmond;"></td></tr><tr><td>blue</td><td>#0000FF</td><td style="background-color: blue;"></td></tr><tr><td>blueviolet</td><td>#8A2BE2</td><td style="background-color: blueviolet;"></td></tr><tr><td>brown</td><td>#A52A2A</td><td style="background-color: brown;"></td></tr><tr><td>burlywood</td><td>#DEB887</td><td style="background-color: burlywood;"></td></tr><tr><td>cadetblue</td><td>#5F9EA0</td><td style="background-color: cadetblue;"></td></tr><tr><td>chartreuse</td><td>#7FFF00</td><td style="background-color: chartreuse;"></td></tr><tr><td>chocolate</td><td>#D2691E</td><td style="background-color: chocolate;"></td></tr><tr><td>coral</td><td>#FF7F50</td><td style="background-color: coral;"></td></tr><tr><td>cornflowerblue</td><td>#6495ED</td><td style="background-color: cornflowerblue;"></td></tr><tr><td>cornsilk</td><td>#FFF8DC</td><td style="background-color: cornsilk;"></td></tr><tr><td>crimson</td><td>#DC143C</td><td style="background-color: crimson;"></td></tr><tr><td>cyan</td><td>#00FFFF</td><td style="background-color: cyan;"></td></tr><tr><td>darkblue</td><td>#00008B</td><td style="background-color: darkblue;"></td></tr><tr><td>darkcyan</td><td>#008B8B</td><td style="background-color: darkcyan;"></td></tr><tr><td>darkgoldenrod</td><td>#B8860B</td><td style="background-color: darkgoldenrod;"></td></tr><tr><td>darkgray</td><td>#A9A9A9</td><td style="background-color: darkgray;"></td></tr><tr><td>darkgreen</td><td>#006400</td><td style="background-color: darkgreen;"></td></tr><tr><td>darkgrey</td><td>#A9A9A9</td><td style="background-color: darkgrey;"></td></tr><tr><td>darkkhaki</td><td>#BDB76B</td><td style="background-color: darkkhaki;"></td></tr><tr><td>darkmagenta</td><td>#8B008B</td><td style="background-color: darkmagenta;"></td></tr><tr><td>darkolivegreen</td><td>#556B2F</td><td style="background-color: darkolivegreen;"></td></tr><tr><td>darkorange</td><td>#FF8C00</td><td style="background-color: darkorange;"></td></tr><tr><td>darkorchid</td><td>#9932CC</td><td style="background-color: darkorchid;"></td></tr><tr><td>darkred</td><td>#8B0000</td><td style="background-color: darkred;"></td></tr><tr><td>darksalmon</td><td>#E9967A</td><td style="background-color: darksalmon;"></td></tr><tr><td>darkseagreen</td><td>#8FBC8F</td><td style="background-color: darkseagreen;"></td></tr><tr><td>darkslateblue</td><td>#483D8B</td><td style="background-color: darkslateblue;"></td></tr><tr><td>darkslategray</td><td>#2F4F4F</td><td style="background-color: darkslategray;"></td></tr><tr><td>darkslategrey</td><td>#2F4F4F</td><td style="background-color: darkslategrey;"></td></tr><tr><td>darkturquoise</td><td>#00CED1</td><td style="background-color: darkturquoise;"></td></tr><tr><td>darkviolet</td><td>#9400D3</td><td style="background-color: darkviolet;"></td></tr><tr><td>deeppink</td><td>#FF1493</td><td style="background-color: deeppink;"></td></tr><tr><td>deepskyblue</td><td>#00BFFF</td><td style="background-color: deepskyblue;"></td></tr><tr><td>dimgray</td><td>#696969</td><td style="background-color: dimgray;"></td></tr><tr><td>dimgrey</td><td>#696969</td><td style="background-color: dimgrey;"></td></tr><tr><td>dodgerblue</td><td>#1E90FF</td><td style="background-color: dodgerblue;"></td></tr><tr><td>firebrick</td><td>#B22222</td><td style="background-color: firebrick;"></td></tr><tr><td>floralwhite</td><td>#FFFAF0</td><td style="background-color: floralwhite;"></td></tr><tr><td>forestgreen</td><td>#228B22</td><td style="background-color: forestgreen;"></td></tr><tr><td>fuchsia</td><td>#FF00FF</td><td style="background-color: fuchsia;"></td></tr><tr><td>gainsboro</td><td>#DCDCDC</td><td style="background-color: gainsboro;"></td></tr><tr><td>ghostwhite</td><td>#F8F8FF</td><td style="background-color: ghostwhite;"></td></tr><tr><td>gold</td><td>#FFD700</td><td style="background-color: gold;"></td></tr><tr><td>goldenrod</td><td>#DAA520</td><td style="background-color: goldenrod;"></td></tr><tr><td>gray</td><td>#808080</td><td style="background-color: gray;"></td></tr><tr><td>green</td><td>#008000</td><td style="background-color: green;"></td></tr><tr><td>greenyellow</td><td>#ADFF2F</td><td style="background-color: greenyellow;"></td></tr><tr><td>grey</td><td>#808080</td><td style="background-color: grey;"></td></tr><tr><td>honeydew</td><td>#F0FFF0</td><td style="background-color: honeydew;"></td></tr><tr><td>hotpink</td><td>#FF69B4</td><td style="background-color: hotpink;"></td></tr><tr><td>indianred</td><td>#CD5C5C</td><td style="background-color: indianred;"></td></tr><tr><td>indigo</td><td>#4B0082</td><td style="background-color: indigo;"></td></tr><tr><td>ivory</td><td>#FFFFF0</td><td style="background-color: ivory;"></td></tr><tr><td>khaki</td><td>#F0E68C</td><td style="background-color: khaki;"></td></tr><tr><td>lavender</td><td>#E6E6FA</td><td style="background-color: lavender;"></td></tr><tr><td>lavenderblush</td><td>#FFF0F5</td><td style="background-color: lavenderblush;"></td></tr><tr><td>lawngreen</td><td>#7CFC00</td><td style="background-color: lawngreen;"></td></tr><tr><td>lemonchiffon</td><td>#FFFACD</td><td style="background-color: lemonchiffon;"></td></tr><tr><td>lightblue</td><td>#ADD8E6</td><td style="background-color: lightblue;"></td></tr><tr><td>lightcoral</td><td>#F08080</td><td style="background-color: lightcoral;"></td></tr><tr><td>lightcyan</td><td>#E0FFFF</td><td style="background-color: lightcyan;"></td></tr><tr><td>lightgoldenrodyellow</td><td>#FAFAD2</td><td style="background-color: lightgoldenrodyellow;"></td></tr><tr><td>lightgray</td><td>#D3D3D3</td><td style="background-color: lightgray;"></td></tr><tr><td>lightgreen</td><td>#90EE90</td><td style="background-color: lightgreen;"></td></tr><tr><td>lightgrey</td><td>#D3D3D3</td><td style="background-color: lightgrey;"></td></tr><tr><td>lightpink</td><td>#FFB6C1</td><td style="background-color: lightpink;"></td></tr><tr><td>lightsalmon</td><td>#FFA07A</td><td style="background-color: lightsalmon;"></td></tr><tr><td>lightseagreen</td><td>#20B2AA</td><td style="background-color: lightseagreen;"></td></tr><tr><td>lightskyblue</td><td>#87CEFA</td><td style="background-color: lightskyblue;"></td></tr><tr><td>lightslategray</td><td>#778899</td><td style="background-color: lightslategray;"></td></tr><tr><td>lightslategrey</td><td>#778899</td><td style="background-color: lightslategrey;"></td></tr><tr><td>lightsteelblue</td><td>#B0C4DE</td><td style="background-color: lightsteelblue;"></td></tr><tr><td>lightyellow</td><td>#FFFFE0</td><td style="background-color: lightyellow;"></td></tr><tr><td>lime</td><td>#00FF00</td><td style="background-color: lime;"></td></tr><tr><td>limegreen</td><td>#32CD32</td><td style="background-color: limegreen;"></td></tr><tr><td>linen</td><td>#FAF0E6</td><td style="background-color: linen;"></td></tr><tr><td>magenta</td><td>#FF00FF</td><td style="background-color: magenta;"></td></tr><tr><td>maroon</td><td>#800000</td><td style="background-color: maroon;"></td></tr><tr><td>mediumaquamarine</td><td>#66CDAA</td><td style="background-color: mediumaquamarine;"></td></tr><tr><td>mediumblue</td><td>#0000CD</td><td style="background-color: mediumblue;"></td></tr><tr><td>mediumorchid</td><td>#BA55D3</td><td style="background-color: mediumorchid;"></td></tr><tr><td>mediumpurple</td><td>#9370DB</td><td style="background-color: mediumpurple;"></td></tr><tr><td>mediumseagreen</td><td>#3CB371</td><td style="background-color: mediumseagreen;"></td></tr><tr><td>mediumslateblue</td><td>#7B68EE</td><td style="background-color: mediumslateblue;"></td></tr><tr><td>mediumspringgreen</td><td>#00FA9A</td><td style="background-color: mediumspringgreen;"></td></tr><tr><td>mediumturquoise</td><td>#48D1CC</td><td style="background-color: mediumturquoise;"></td></tr><tr><td>mediumvioletred</td><td>#C71585</td><td style="background-color: mediumvioletred;"></td></tr><tr><td>midnightblue</td><td>#191970</td><td style="background-color: midnightblue;"></td></tr><tr><td>mintcream</td><td>#F5FFFA</td><td style="background-color: mintcream;"></td></tr><tr><td>mistyrose</td><td>#FFE4E1</td><td style="background-color: mistyrose;"></td></tr><tr><td>moccasin</td><td>#FFE4B5</td><td style="background-color: moccasin;"></td></tr><tr><td>navajowhite</td><td>#FFDEAD</td><td style="background-color: navajowhite;"></td></tr><tr><td>navy</td><td>#000080</td><td style="background-color: navy;"></td></tr><tr><td>oldlace</td><td>#FDF5E6</td><td style="background-color: oldlace;"></td></tr><tr><td>olive</td><td>#808000</td><td style="background-color: olive;"></td></tr><tr><td>olivedrab</td><td>#6B8E23</td><td style="background-color: olivedrab;"></td></tr><tr><td>orange</td><td>#FFA500</td><td style="background-color: orange;"></td></tr><tr><td>orangered</td><td>#FF4500</td><td style="background-color: orangered;"></td></tr><tr><td>orchid</td><td>#DA70D6</td><td style="background-color: orchid;"></td></tr><tr><td>palegoldenrod</td><td>#EEE8AA</td><td style="background-color: palegoldenrod;"></td></tr><tr><td>palegreen</td><td>#98FB98</td><td style="background-color: palegreen;"></td></tr><tr><td>paleturquoise</td><td>#AFEEEE</td><td style="background-color: paleturquoise;"></td></tr><tr><td>palevioletred</td><td>#DB7093</td><td style="background-color: palevioletred;"></td></tr><tr><td>papayawhip</td><td>#FFEFD5</td><td style="background-color: papayawhip;"></td></tr><tr><td>peachpuff</td><td>#FFDAB9</td><td style="background-color: peachpuff;"></td></tr><tr><td>peru</td><td>#CD853F</td><td style="background-color: peru;"></td></tr><tr><td>pink</td><td>#FFC0CB</td><td style="background-color: pink;"></td></tr><tr><td>plum</td><td>#DDA0DD</td><td style="background-color: plum;"></td></tr><tr><td>powderblue</td><td>#B0E0E6</td><td style="background-color: powderblue;"></td></tr><tr><td>purple</td><td>#800080</td><td style="background-color: purple;"></td></tr><tr><td>rebeccapurple</td><td>#663399</td><td style="background-color: rebeccapurple;"></td></tr><tr><td>red</td><td>#FF0000</td><td style="background-color: red;"></td></tr><tr><td>rosybrown</td><td>#BC8F8F</td><td style="background-color: rosybrown;"></td></tr><tr><td>royalblue</td><td>#4169E1</td><td style="background-color: royalblue;"></td></tr><tr><td>saddlebrown</td><td>#8B4513</td><td style="background-color: saddlebrown;"></td></tr><tr><td>salmon</td><td>#FA8072</td><td style="background-color: salmon;"></td></tr><tr><td>sandybrown</td><td>#F4A460</td><td style="background-color: sandybrown;"></td></tr><tr><td>seagreen</td><td>#2E8B57</td><td style="background-color: seagreen;"></td></tr><tr><td>seashell</td><td>#FFF5EE</td><td style="background-color: seashell;"></td></tr><tr><td>sienna</td><td>#A0522D</td><td style="background-color: sienna;"></td></tr><tr><td>silver</td><td>#C0C0C0</td><td style="background-color: silver;"></td></tr><tr><td>skyblue</td><td>#87CEEB</td><td style="background-color: skyblue;"></td></tr><tr><td>slateblue</td><td>#6A5ACD</td><td style="background-color: slateblue;"></td></tr><tr><td>slategray</td><td>#708090</td><td style="background-color: slategray;"></td></tr><tr><td>slategrey</td><td>#708090</td><td style="background-color: slategrey;"></td></tr><tr><td>snow</td><td>#FFFAFA</td><td style="background-color: snow;"></td></tr><tr><td>springgreen</td><td>#00FF7F</td><td style="background-color: springgreen;"></td></tr><tr><td>steelblue</td><td>#4682B4</td><td style="background-color: steelblue;"></td></tr><tr><td>tan</td><td>#D2B48C</td><td style="background-color: tan;"></td></tr><tr><td>teal</td><td>#008080</td><td style="background-color: teal;"></td></tr><tr><td>thistle</td><td>#D8BFD8</td><td style="background-color: thistle;"></td></tr><tr><td>tomato</td><td>#FF6347</td><td style="background-color: tomato;"></td></tr><tr><td>turquoise</td><td>#40E0D0</td><td style="background-color: turquoise;"></td></tr><tr><td>violet</td><td>#EE82EE</td><td style="background-color: violet;"></td></tr><tr><td>wheat</td><td>#F5DEB3</td><td style="background-color: wheat;"></td></tr><tr><td>white</td><td>#FFFFFF</td><td style="background-color: white;"></td></tr><tr><td>whitesmoke</td><td>#F5F5F5</td><td style="background-color: whitesmoke;"></td></tr><tr><td>yellow</td><td>#FFFF00</td><td style="background-color: yellow;"></td></tr><tr><td>yellowgreen</td><td>#9ACD32</td><td style="background-color: yellowgreen;"></td></tr></tbody></table>

<style>

table { width: 100%; } table.color-names tr th, table.color-names tr td { font-size: 1.2rem; } <p> table { border-collapse: collapse; border-spacing: 0; background: var(–bg); border: 1px solid var(–gs0); table-layout: auto; margin: 0 auto } table thead { background: var(–bg3) } table thead tr th { padding: .5rem .625rem .625rem; font-size: 1.625rem; font-weight: 700; color: var(–text-color) } table tr td, table tr th { padding: .5625rem .625rem; font-size: 1.5rem; color: var(–text-color); text-align: center } table tr:nth-of-type(even) { background: var(–bg3) } table tbody tr td, table tbody tr th, table thead tr th, table tr td { display: table-cell; line-height: 2.8125rem }

</style>

Reference: CSS Color Names

Table of Contents

Links

Newsletter

Contact