CSS defines 148 color names, from aliceblue to yellowgreen, and every browser understands them in HTML and CSS. Nine are second spellings of another name, such as grey for gray and cyan for aqua, so there are 139 distinct colors. The table below gives each one's HEX, RGB, HSL and OKLCH values, text contrast and closest Tailwind class.
| Question | Answer |
|---|---|
| How many names? | 148 (139 distinct colors) |
| Case sensitive? | No: Red, RED and red are the same |
| Where defined? | CSS Color Module Level 4 |
| Newest name | rebeccapurple (#663399), added in 2014 |
Updated
Search by name or HEX, filter by colour family, sort by hue, lightness or name, and copy any value with one click. Each row also shows whether black or white text is readable on that colour and which Tailwind colour is closest.
| Name | HEX | RGB | HSL | OKLCH | On white | On black | Nearest Tailwind |
|---|---|---|---|---|---|---|---|
| aliceblue | #F0F8FF | rgb(240, 248, 255) | hsl(208, 100%, 97%) | oklch(97.5% 0.013 244.3) | 1.07:1 | 19.58:1 | sky-50 |
| antiquewhite | #FAEBD7 | rgb(250, 235, 215) | hsl(34, 78%, 91%) | oklch(94.7% 0.031 75.2) | 1.17:1 | 17.93:1 | orange-100 |
| aqua | #00FFFF | rgb(0, 255, 255) | hsl(180, 100%, 50%) | oklch(90.5% 0.155 194.8) | 1.25:1 | 16.75:1 | cyan-300 |
| aquamarine | #7FFFD4 | rgb(127, 255, 212) | hsl(160, 100%, 75%) | oklch(91.5% 0.13 169) | 1.22:1 | 17.16:1 | emerald-200 |
| azure | #F0FFFF | rgb(240, 255, 255) | hsl(180, 100%, 97%) | oklch(98.9% 0.016 196.9) | 1.03:1 | 20.45:1 | cyan-50 |
| beige | #F5F5DC | rgb(245, 245, 220) | hsl(60, 56%, 91%) | oklch(96.4% 0.033 107) | 1.11:1 | 18.98:1 | orange-100 |
| bisque | #FFE4C4 | rgb(255, 228, 196) | hsl(33, 100%, 88%) | oklch(93.3% 0.051 71.8) | 1.22:1 | 17.15:1 | orange-100 |
| black | #000000 | rgb(0, 0, 0) | hsl(0, 0%, 0%) | oklch(0% 0 0) | 21.00:1 | 1.00:1 | black |
| blanchedalmond | #FFEBCD | rgb(255, 235, 205) | hsl(36, 100%, 90%) | oklch(94.8% 0.045 78.1) | 1.17:1 | 18.02:1 | orange-100 |
| blue | #0000FF | rgb(0, 0, 255) | hsl(240, 100%, 50%) | oklch(45.2% 0.313 264.1) | 8.59:1 | 2.44:1 | blue-700 |
| blueviolet | #8A2BE2 | rgb(138, 43, 226) | hsl(271, 76%, 53%) | oklch(53.4% 0.25 301.4) | 5.96:1 | 3.52:1 | purple-700 |
| brown | #A52A2A | rgb(165, 42, 42) | hsl(0, 59%, 41%) | oklch(48.1% 0.16 25.6) | 7.08:1 | 2.96:1 | orange-800 |
| burlywood | #DEB887 | rgb(222, 184, 135) | hsl(34, 57%, 70%) | oklch(80.5% 0.078 73.4) | 1.86:1 | 11.31:1 | orange-300 |
| cadetblue | #5F9EA0 | rgb(95, 158, 160) | hsl(182, 25%, 50%) | oklch(65.8% 0.065 198.3) | 3.05:1 | 6.88:1 | slate-400 |
| chartreuse | #7FFF00 | rgb(127, 255, 0) | hsl(90, 100%, 50%) | oklch(89% 0.265 136) | 1.30:1 | 16.21:1 | lime-400 |
| chocolate | #D2691E | rgb(210, 105, 30) | hsl(25, 75%, 47%) | oklch(63.4% 0.155 50.3) | 3.63:1 | 5.78:1 | amber-600 |
| coral | #FF7F50 | rgb(255, 127, 80) | hsl(16, 100%, 66%) | oklch(73.5% 0.168 40.2) | 2.50:1 | 8.40:1 | orange-400 |
| cornflowerblue | #6495ED | rgb(100, 149, 237) | hsl(219, 79%, 66%) | oklch(67.5% 0.141 261.3) | 2.97:1 | 7.06:1 | blue-400 |
| cornsilk | #FFF8DC | rgb(255, 248, 220) | hsl(48, 100%, 93%) | oklch(97.7% 0.037 95.4) | 1.07:1 | 19.71:1 | yellow-50 |
| crimson | #DC143C | rgb(220, 20, 60) | hsl(348, 83%, 47%) | oklch(57.1% 0.222 20.1) | 4.99:1 | 4.21:1 | rose-600 |
| cyan | #00FFFF | rgb(0, 255, 255) | hsl(180, 100%, 50%) | oklch(90.5% 0.155 194.8) | 1.25:1 | 16.75:1 | cyan-300 |
| darkblue | #00008B | rgb(0, 0, 139) | hsl(240, 100%, 27%) | oklch(28.8% 0.199 264.1) | 15.30:1 | 1.37:1 | violet-950 |
| darkcyan | #008B8B | rgb(0, 139, 139) | hsl(180, 100%, 27%) | oklch(57.7% 0.098 194.8) | 4.15:1 | 5.07:1 | teal-600 |
| darkgoldenrod | #B8860B | rgb(184, 134, 11) | hsl(43, 89%, 38%) | oklch(65.2% 0.132 81.6) | 3.25:1 | 6.45:1 | yellow-600 |
| darkgray | #A9A9A9 | rgb(169, 169, 169) | hsl(0, 0%, 66%) | oklch(73.5% 0 0) | 2.35:1 | 8.94:1 | mist-400 |
| darkgreen | #006400 | rgb(0, 100, 0) | hsl(120, 100%, 20%) | oklch(43.6% 0.148 142.5) | 7.44:1 | 2.82:1 | green-800 |
| darkgrey | #A9A9A9 | rgb(169, 169, 169) | hsl(0, 0%, 66%) | oklch(73.5% 0 0) | 2.35:1 | 8.94:1 | mist-400 |
| darkkhaki | #BDB76B | rgb(189, 183, 107) | hsl(56, 38%, 58%) | oklch(76.7% 0.098 104.5) | 2.07:1 | 10.15:1 | olive-400 |
| darkmagenta | #8B008B | rgb(139, 0, 139) | hsl(300, 100%, 27%) | oklch(44.7% 0.205 328.4) | 8.50:1 | 2.47:1 | fuchsia-800 |
| darkolivegreen | #556B2F | rgb(85, 107, 47) | hsl(82, 39%, 30%) | oklch(49.6% 0.09 126.2) | 5.95:1 | 3.53:1 | lime-800 |
| darkorange | #FF8C00 | rgb(255, 140, 0) | hsl(33, 100%, 50%) | oklch(75.1% 0.179 58.3) | 2.33:1 | 9.00:1 | orange-400 |
| darkorchid | #9932CC | rgb(153, 50, 204) | hsl(280, 61%, 50%) | oklch(54.1% 0.227 311.5) | 5.70:1 | 3.68:1 | fuchsia-700 |
| darkred | #8B0000 | rgb(139, 0, 0) | hsl(0, 100%, 27%) | oklch(40% 0.164 29.2) | 10.01:1 | 2.10:1 | red-900 |
| darksalmon | #E9967A | rgb(233, 150, 122) | hsl(15, 72%, 70%) | oklch(75.1% 0.108 39.4) | 2.31:1 | 9.11:1 | red-300 |
| darkseagreen | #8FBC8F | rgb(143, 188, 143) | hsl(120, 25%, 65%) | oklch(75.1% 0.08 144.7) | 2.15:1 | 9.76:1 | olive-400 |
| darkslateblue | #483D8B | rgb(72, 61, 139) | hsl(248, 39%, 39%) | oklch(41.4% 0.125 286) | 9.07:1 | 2.32:1 | indigo-900 |
| darkslategray | #2F4F4F | rgb(47, 79, 79) | hsl(180, 25%, 25%) | oklch(40.3% 0.038 195.8) | 8.93:1 | 2.35:1 | teal-900 |
| darkslategrey | #2F4F4F | rgb(47, 79, 79) | hsl(180, 25%, 25%) | oklch(40.3% 0.038 195.8) | 8.93:1 | 2.35:1 | teal-900 |
| darkturquoise | #00CED1 | rgb(0, 206, 209) | hsl(181, 100%, 41%) | oklch(77.2% 0.131 196.6) | 1.95:1 | 10.75:1 | teal-400 |
| darkviolet | #9400D3 | rgb(148, 0, 211) | hsl(282, 100%, 41%) | oklch(51.5% 0.261 309.8) | 6.56:1 | 3.20:1 | purple-700 |
| deeppink | #FF1493 | rgb(255, 20, 147) | hsl(328, 100%, 54%) | oklch(65.5% 0.261 356.9) | 3.64:1 | 5.77:1 | pink-500 |
| deepskyblue | #00BFFF | rgb(0, 191, 255) | hsl(195, 100%, 50%) | oklch(75.5% 0.153 231.6) | 2.12:1 | 9.90:1 | sky-400 |
| dimgray | #696969 | rgb(105, 105, 105) | hsl(0, 0%, 41%) | oklch(52.1% 0 0) | 5.49:1 | 3.83:1 | taupe-500 |
| dimgrey | #696969 | rgb(105, 105, 105) | hsl(0, 0%, 41%) | oklch(52.1% 0 0) | 5.49:1 | 3.83:1 | taupe-500 |
| dodgerblue | #1E90FF | rgb(30, 144, 255) | hsl(210, 100%, 56%) | oklch(65.2% 0.19 253.2) | 3.24:1 | 6.49:1 | blue-500 |
| firebrick | #B22222 | rgb(178, 34, 34) | hsl(0, 68%, 42%) | oklch(49.7% 0.18 26.8) | 6.68:1 | 3.14:1 | red-700 |
| floralwhite | #FFFAF0 | rgb(255, 250, 240) | hsl(40, 100%, 97%) | oklch(98.6% 0.014 84.6) | 1.04:1 | 20.18:1 | orange-50 |
| forestgreen | #228B22 | rgb(34, 139, 34) | hsl(120, 61%, 34%) | oklch(55.8% 0.169 142.9) | 4.39:1 | 4.78:1 | green-700 |
| fuchsia | #FF00FF | rgb(255, 0, 255) | hsl(300, 100%, 50%) | oklch(70.2% 0.322 328.4) | 3.14:1 | 6.70:1 | fuchsia-500 |
| gainsboro | #DCDCDC | rgb(220, 220, 220) | hsl(0, 0%, 86%) | oklch(89.4% 0 0) | 1.37:1 | 15.31:1 | olive-300 |
| ghostwhite | #F8F8FF | rgb(248, 248, 255) | hsl(240, 100%, 99%) | oklch(98.1% 0.009 286.2) | 1.06:1 | 19.86:1 | purple-50 |
| gold | #FFD700 | rgb(255, 215, 0) | hsl(51, 100%, 50%) | oklch(88.7% 0.182 95.3) | 1.40:1 | 14.97:1 | amber-300 |
| goldenrod | #DAA520 | rgb(218, 165, 32) | hsl(43, 74%, 49%) | oklch(75.2% 0.147 84) | 2.24:1 | 9.38:1 | yellow-500 |
| gray | #808080 | rgb(128, 128, 128) | hsl(0, 0%, 50%) | oklch(60% 0 0) | 3.95:1 | 5.32:1 | olive-500 |
| green | #008000 | rgb(0, 128, 0) | hsl(120, 100%, 25%) | oklch(52% 0.177 142.5) | 5.14:1 | 4.09:1 | green-700 |
| greenyellow | #ADFF2F | rgb(173, 255, 47) | hsl(84, 100%, 59%) | oklch(91.3% 0.233 130) | 1.23:1 | 17.12:1 | lime-300 |
| grey | #808080 | rgb(128, 128, 128) | hsl(0, 0%, 50%) | oklch(60% 0 0) | 3.95:1 | 5.32:1 | olive-500 |
| honeydew | #F0FFF0 | rgb(240, 255, 240) | hsl(120, 100%, 97%) | oklch(98.5% 0.025 145.4) | 1.04:1 | 20.27:1 | green-50 |
| hotpink | #FF69B4 | rgb(255, 105, 180) | hsl(330, 100%, 71%) | oklch(72.8% 0.197 352) | 2.65:1 | 7.93:1 | pink-400 |
| indianred | #CD5C5C | rgb(205, 92, 92) | hsl(0, 53%, 58%) | oklch(61.5% 0.144 22.2) | 3.98:1 | 5.28:1 | orange-700 |
| indigo | #4B0082 | rgb(75, 0, 130) | hsl(275, 100%, 25%) | oklch(33.9% 0.179 301.7) | 12.95:1 | 1.62:1 | purple-900 |
| ivory | #FFFFF0 | rgb(255, 255, 240) | hsl(60, 100%, 97%) | oklch(99.6% 0.02 106.8) | 1.01:1 | 20.81:1 | amber-50 |
| khaki | #F0E68C | rgb(240, 230, 140) | hsl(54, 77%, 75%) | oklch(91.3% 0.112 102.8) | 1.28:1 | 16.40:1 | amber-200 |
| lavender | #E6E6FA | rgb(230, 230, 250) | hsl(240, 67%, 94%) | oklch(93.1% 0.027 285.9) | 1.23:1 | 17.06:1 | indigo-100 |
| lavenderblush | #FFF0F5 | rgb(255, 240, 245) | hsl(340, 100%, 97%) | oklch(96.8% 0.017 355.1) | 1.10:1 | 19.03:1 | pink-50 |
| lawngreen | #7CFC00 | rgb(124, 252, 0) | hsl(90, 100%, 49%) | oklch(88.2% 0.263 136.2) | 1.33:1 | 15.78:1 | lime-400 |
| lemonchiffon | #FFFACD | rgb(255, 250, 205) | hsl(54, 100%, 90%) | oklch(97.8% 0.058 102.2) | 1.06:1 | 19.81:1 | yellow-100 |
| lightblue | #ADD8E6 | rgb(173, 216, 230) | hsl(195, 53%, 79%) | oklch(85.6% 0.049 219.7) | 1.53:1 | 13.74:1 | slate-300 |
| lightcoral | #F08080 | rgb(240, 128, 128) | hsl(0, 79%, 72%) | oklch(72.5% 0.138 21) | 2.59:1 | 8.10:1 | red-400 |
| lightcyan | #E0FFFF | rgb(224, 255, 255) | hsl(180, 100%, 94%) | oklch(97.8% 0.032 196.6) | 1.05:1 | 19.92:1 | cyan-50 |
| lightgoldenrodyellow | #FAFAD2 | rgb(250, 250, 210) | hsl(60, 80%, 90%) | oklch(97.5% 0.052 107.3) | 1.07:1 | 19.67:1 | amber-100 |
| lightgray | #D3D3D3 | rgb(211, 211, 211) | hsl(0, 0%, 83%) | oklch(86.7% 0 0) | 1.50:1 | 14.03:1 | neutral-300 |
| lightgreen | #90EE90 | rgb(144, 238, 144) | hsl(120, 73%, 75%) | oklch(86.8% 0.156 144.1) | 1.42:1 | 14.82:1 | green-300 |
| lightgrey | #D3D3D3 | rgb(211, 211, 211) | hsl(0, 0%, 83%) | oklch(86.7% 0 0) | 1.50:1 | 14.03:1 | neutral-300 |
| lightpink | #FFB6C1 | rgb(255, 182, 193) | hsl(351, 100%, 86%) | oklch(84.7% 0.086 9.1) | 1.65:1 | 12.71:1 | red-200 |
| lightsalmon | #FFA07A | rgb(255, 160, 122) | hsl(17, 100%, 74%) | oklch(79.4% 0.125 42.4) | 1.99:1 | 10.56:1 | red-300 |
| lightseagreen | #20B2AA | rgb(32, 178, 170) | hsl(177, 70%, 41%) | oklch(69.1% 0.114 189) | 2.62:1 | 8.01:1 | teal-500 |
| lightskyblue | #87CEFA | rgb(135, 206, 250) | hsl(203, 92%, 75%) | oklch(82.1% 0.095 236.8) | 1.72:1 | 12.24:1 | sky-300 |
| lightslategray | #778899 | rgb(119, 136, 153) | hsl(210, 14%, 53%) | oklch(61.9% 0.032 248.4) | 3.64:1 | 5.77:1 | mist-500 |
| lightslategrey | #778899 | rgb(119, 136, 153) | hsl(210, 14%, 53%) | oklch(61.9% 0.032 248.4) | 3.64:1 | 5.77:1 | mist-500 |
| lightsteelblue | #B0C4DE | rgb(176, 196, 222) | hsl(214, 41%, 78%) | oklch(81.4% 0.043 255) | 1.78:1 | 11.80:1 | slate-300 |
| lightyellow | #FFFFE0 | rgb(255, 255, 224) | hsl(60, 100%, 94%) | oklch(99.2% 0.04 107.1) | 1.02:1 | 20.63:1 | lime-50 |
| lime | #00FF00 | rgb(0, 255, 0) | hsl(120, 100%, 50%) | oklch(86.6% 0.295 142.5) | 1.37:1 | 15.30:1 | lime-400 |
| limegreen | #32CD32 | rgb(50, 205, 50) | hsl(120, 61%, 50%) | oklch(74.2% 0.229 142.8) | 2.12:1 | 9.91:1 | green-500 |
| linen | #FAF0E6 | rgb(250, 240, 230) | hsl(30, 67%, 94%) | oklch(96% 0.017 67.6) | 1.12:1 | 18.67:1 | olive-100 |
| magenta | #FF00FF | rgb(255, 0, 255) | hsl(300, 100%, 50%) | oklch(70.2% 0.322 328.4) | 3.14:1 | 6.70:1 | fuchsia-500 |
| maroon | #800000 | rgb(128, 0, 0) | hsl(0, 100%, 25%) | oklch(37.7% 0.155 29.2) | 10.95:1 | 1.92:1 | red-900 |
| mediumaquamarine | #66CDAA | rgb(102, 205, 170) | hsl(160, 51%, 60%) | oklch(77.7% 0.11 168.8) | 1.93:1 | 10.88:1 | teal-400 |
| mediumblue | #0000CD | rgb(0, 0, 205) | hsl(240, 100%, 40%) | oklch(38.3% 0.266 264.1) | 11.16:1 | 1.88:1 | blue-800 |
| mediumorchid | #BA55D3 | rgb(186, 85, 211) | hsl(288, 59%, 58%) | oklch(62.6% 0.202 319.2) | 3.94:1 | 5.33:1 | purple-500 |
| mediumpurple | #9370DB | rgb(147, 112, 219) | hsl(260, 60%, 65%) | oklch(62.7% 0.158 296.7) | 3.76:1 | 5.58:1 | indigo-400 |
| mediumseagreen | #3CB371 | rgb(60, 179, 113) | hsl(147, 50%, 47%) | oklch(68.4% 0.144 155) | 2.67:1 | 7.88:1 | emerald-500 |
| mediumslateblue | #7B68EE | rgb(123, 104, 238) | hsl(249, 80%, 67%) | oklch(60.4% 0.194 285.5) | 4.15:1 | 5.06:1 | indigo-500 |
| mediumspringgreen | #00FA9A | rgb(0, 250, 154) | hsl(157, 100%, 49%) | oklch(86.7% 0.207 156.9) | 1.39:1 | 15.14:1 | green-300 |
| mediumturquoise | #48D1CC | rgb(72, 209, 204) | hsl(178, 60%, 55%) | oklch(78.7% 0.116 191.6) | 1.86:1 | 11.27:1 | teal-400 |
| mediumvioletred | #C71585 | rgb(199, 21, 133) | hsl(322, 81%, 43%) | oklch(55.3% 0.222 349.7) | 5.42:1 | 3.87:1 | pink-700 |
| midnightblue | #191970 | rgb(25, 25, 112) | hsl(240, 64%, 27%) | oklch(28.8% 0.144 272.8) | 14.85:1 | 1.41:1 | violet-950 |
| mintcream | #F5FFFA | rgb(245, 255, 250) | hsl(150, 100%, 98%) | oklch(99.1% 0.012 164.8) | 1.02:1 | 20.57:1 | teal-50 |
| mistyrose | #FFE4E1 | rgb(255, 228, 225) | hsl(6, 100%, 94%) | oklch(94% 0.03 25.3) | 1.20:1 | 17.44:1 | red-100 |
| moccasin | #FFE4B5 | rgb(255, 228, 181) | hsl(38, 100%, 85%) | oklch(93% 0.068 81.4) | 1.23:1 | 17.02:1 | orange-200 |
| navajowhite | #FFDEAD | rgb(255, 222, 173) | hsl(36, 100%, 84%) | oklch(91.6% 0.073 77.4) | 1.29:1 | 16.30:1 | orange-200 |
| navy | #000080 | rgb(0, 0, 128) | hsl(240, 100%, 25%) | oklch(27.1% 0.188 264.1) | 16.01:1 | 1.31:1 | violet-950 |
| oldlace | #FDF5E6 | rgb(253, 245, 230) | hsl(39, 85%, 95%) | oklch(97.2% 0.022 83.3) | 1.08:1 | 19.38:1 | orange-50 |
| olive | #808000 | rgb(128, 128, 0) | hsl(60, 100%, 25%) | oklch(58.1% 0.127 109.8) | 4.20:1 | 5.01:1 | lime-700 |
| olivedrab | #6B8E23 | rgb(107, 142, 35) | hsl(80, 60%, 35%) | oklch(59.9% 0.137 126.3) | 3.81:1 | 5.52:1 | lime-700 |
| orange | #FFA500 | rgb(255, 165, 0) | hsl(39, 100%, 50%) | oklch(79.3% 0.171 70.7) | 1.97:1 | 10.63:1 | amber-500 |
| orangered | #FF4500 | rgb(255, 69, 0) | hsl(16, 100%, 50%) | oklch(66% 0.229 35.4) | 3.44:1 | 6.10:1 | orange-600 |
| orchid | #DA70D6 | rgb(218, 112, 214) | hsl(302, 59%, 65%) | oklch(70.2% 0.181 328.7) | 2.89:1 | 7.27:1 | fuchsia-400 |
| palegoldenrod | #EEE8AA | rgb(238, 232, 170) | hsl(55, 67%, 80%) | oklch(92.1% 0.08 103.2) | 1.25:1 | 16.76:1 | amber-200 |
| palegreen | #98FB98 | rgb(152, 251, 152) | hsl(120, 93%, 79%) | oklch(90.4% 0.162 144.1) | 1.27:1 | 16.59:1 | green-300 |
| paleturquoise | #AFEEEE | rgb(175, 238, 238) | hsl(180, 65%, 81%) | oklch(90.7% 0.063 196.1) | 1.29:1 | 16.29:1 | cyan-200 |
| palevioletred | #DB7093 | rgb(219, 112, 147) | hsl(340, 60%, 65%) | oklch(67.8% 0.138 0.7) | 3.11:1 | 6.75:1 | rose-400 |
| papayawhip | #FFEFD5 | rgb(255, 239, 213) | hsl(37, 100%, 92%) | oklch(95.8% 0.038 80) | 1.13:1 | 18.56:1 | orange-100 |
| peachpuff | #FFDAB9 | rgb(255, 218, 185) | hsl(28, 100%, 86%) | oklch(91.1% 0.06 63.7) | 1.31:1 | 15.98:1 | orange-200 |
| peru | #CD853F | rgb(205, 133, 63) | hsl(30, 59%, 53%) | oklch(67.8% 0.123 62.2) | 2.99:1 | 7.02:1 | yellow-600 |
| pink | #FFC0CB | rgb(255, 192, 203) | hsl(350, 100%, 88%) | oklch(86.8% 0.074 7.1) | 1.54:1 | 13.65:1 | red-200 |
| plum | #DDA0DD | rgb(221, 160, 221) | hsl(300, 47%, 75%) | oklch(78.3% 0.108 326.5) | 2.07:1 | 10.15:1 | pink-300 |
| powderblue | #B0E0E6 | rgb(176, 224, 230) | hsl(187, 52%, 80%) | oklch(87.5% 0.05 205.7) | 1.43:1 | 14.65:1 | sky-200 |
| purple | #800080 | rgb(128, 0, 128) | hsl(300, 100%, 25%) | oklch(42.1% 0.193 328.4) | 9.42:1 | 2.23:1 | fuchsia-900 |
| rebeccapurple | #663399 | rgb(102, 51, 153) | hsl(270, 50%, 40%) | oklch(44% 0.16 303.4) | 8.41:1 | 2.50:1 | purple-800 |
| red | #FF0000 | rgb(255, 0, 0) | hsl(0, 100%, 50%) | oklch(62.8% 0.258 29.2) | 4.00:1 | 5.25:1 | red-500 |
| rosybrown | #BC8F8F | rgb(188, 143, 143) | hsl(0, 25%, 65%) | oklch(69.3% 0.055 18.6) | 2.81:1 | 7.46:1 | taupe-400 |
| royalblue | #4169E1 | rgb(65, 105, 225) | hsl(225, 73%, 57%) | oklch(56% 0.188 266.4) | 4.85:1 | 4.33:1 | blue-600 |
| saddlebrown | #8B4513 | rgb(139, 69, 19) | hsl(25, 76%, 31%) | oklch(47.1% 0.112 50.8) | 7.10:1 | 2.96:1 | yellow-800 |
| salmon | #FA8072 | rgb(250, 128, 114) | hsl(6, 93%, 71%) | oklch(73.5% 0.152 28.1) | 2.50:1 | 8.40:1 | red-400 |
| sandybrown | #F4A460 | rgb(244, 164, 96) | hsl(28, 87%, 67%) | oklch(78.4% 0.127 59.7) | 2.03:1 | 10.33:1 | orange-300 |
| seagreen | #2E8B57 | rgb(46, 139, 87) | hsl(146, 50%, 36%) | oklch(56.9% 0.119 154.9) | 4.25:1 | 4.95:1 | emerald-600 |
| seashell | #FFF5EE | rgb(255, 245, 238) | hsl(25, 100%, 97%) | oklch(97.6% 0.014 57.6) | 1.07:1 | 19.55:1 | orange-50 |
| sienna | #A0522D | rgb(160, 82, 45) | hsl(19, 56%, 40%) | oklch(52.6% 0.115 44.6) | 5.62:1 | 3.74:1 | amber-700 |
| silver | #C0C0C0 | rgb(192, 192, 192) | hsl(0, 0%, 75%) | oklch(80.8% 0 0) | 1.82:1 | 11.54:1 | mauve-300 |
| skyblue | #87CEEB | rgb(135, 206, 235) | hsl(197, 71%, 73%) | oklch(81.5% 0.082 225.8) | 1.74:1 | 12.06:1 | sky-300 |
| slateblue | #6A5ACD | rgb(106, 90, 205) | hsl(248, 53%, 58%) | oklch(54.4% 0.171 285.5) | 5.31:1 | 3.96:1 | indigo-500 |
| slategray | #708090 | rgb(112, 128, 144) | hsl(210, 13%, 50%) | oklch(59.3% 0.031 248.3) | 4.05:1 | 5.18:1 | mist-500 |
| slategrey | #708090 | rgb(112, 128, 144) | hsl(210, 13%, 50%) | oklch(59.3% 0.031 248.3) | 4.05:1 | 5.18:1 | mist-500 |
| snow | #FFFAFA | rgb(255, 250, 250) | hsl(0, 100%, 99%) | oklch(98.9% 0.005 17.2) | 1.03:1 | 20.31:1 | taupe-50 |
| springgreen | #00FF7F | rgb(0, 255, 127) | hsl(150, 100%, 50%) | oklch(87.5% 0.235 151) | 1.35:1 | 15.61:1 | green-300 |
| steelblue | #4682B4 | rgb(70, 130, 180) | hsl(207, 44%, 49%) | oklch(58.8% 0.099 245.7) | 4.11:1 | 5.11:1 | cyan-600 |
| tan | #D2B48C | rgb(210, 180, 140) | hsl(34, 44%, 69%) | oklch(78.6% 0.064 74.6) | 1.97:1 | 10.65:1 | olive-400 |
| teal | #008080 | rgb(0, 128, 128) | hsl(180, 100%, 25%) | oklch(54.3% 0.093 194.8) | 4.77:1 | 4.40:1 | teal-700 |
| thistle | #D8BFD8 | rgb(216, 191, 216) | hsl(300, 24%, 80%) | oklch(83.3% 0.044 326) | 1.70:1 | 12.36:1 | mauve-300 |
| tomato | #FF6347 | rgb(255, 99, 71) | hsl(9, 100%, 64%) | oklch(69.6% 0.196 32.3) | 2.95:1 | 7.13:1 | red-400 |
| turquoise | #40E0D0 | rgb(64, 224, 208) | hsl(174, 72%, 56%) | oklch(82.2% 0.131 185.1) | 1.64:1 | 12.79:1 | teal-300 |
| violet | #EE82EE | rgb(238, 130, 238) | hsl(300, 76%, 72%) | oklch(76.2% 0.186 327.2) | 2.32:1 | 9.06:1 | fuchsia-400 |
| wheat | #F5DEB3 | rgb(245, 222, 179) | hsl(39, 77%, 83%) | oklch(90.9% 0.061 83) | 1.31:1 | 15.98:1 | orange-200 |
| white | #FFFFFF | rgb(255, 255, 255) | hsl(0, 0%, 100%) | oklch(100% 0 0) | 1.00:1 | 21.00:1 | white |
| whitesmoke | #F5F5F5 | rgb(245, 245, 245) | hsl(0, 0%, 96%) | oklch(97% 0 0) | 1.09:1 | 19.26:1 | neutral-100 |
| yellow | #FFFF00 | rgb(255, 255, 0) | hsl(60, 100%, 50%) | oklch(96.8% 0.211 109.8) | 1.07:1 | 19.56:1 | yellow-300 |
| yellowgreen | #9ACD32 | rgb(154, 205, 50) | hsl(80, 61%, 50%) | oklch(78.5% 0.184 126.6) | 1.88:1 | 11.15:1 | lime-500 |
HTML 4 defined 16 basic colour names: black, silver, gray, white, maroon, red, purple, fuchsia, green, lime, olive, yellow, navy, blue, teal and aqua. Browsers had also picked up a much longer list from the X Window System, and CSS3 made that list official. CSS Color Level 4 adds rebeccapurple and keeps the rest unchanged.
Because the X11 names were chosen by people, not by a formula, they are uneven. There are many near-whites and several near-identical greens, while some hues have no name at all. Sorting the table by hue shows the gaps clearly.
OKLCH describes a colour as lightness, chroma (how colourful it is) and hue, in a space designed so that equal steps look equal. It is useful for building palettes from a named colour, because changing only the lightness keeps the hue looking the same.
The contrast columns use the WCAG 2 formula. 4.5:1 or more is needed for normal body text and 3:1 for large text. The Tailwind column names the class in Tailwind's default palette that looks closest, with a difference figure: under 2 is hard to tell apart.
There are 148 named colours in CSS Color Module Level 4, which HTML uses. Nine pairs are aliases for the same colour: aqua and cyan, fuchsia and magenta, and seven names that can be spelled with gray or grey, such as darkgray and darkgrey. So the list describes 139 distinct colours.
Yes. All 148 names are supported by every current browser. The original 16 names from HTML 4, such as red, navy and teal, have worked for decades; the rest came from the X11 colour list and are long supported too.
The names come from two different sources. gray was defined in HTML at 50% lightness (#808080), while darkgray came from the older X11 colour list, where it was #A9A9A9. When the lists merged, both values were kept as they were.
It is #663399, added to CSS in 2014 in memory of Rebecca Meyer, the daughter of CSS author Eric Meyer. It is the most recent colour name added to CSS.
Use HEX, RGB, HSL or OKLCH values, ideally stored as custom properties, for production design work, because names cover only 148 fixed points. Names are fine for quick tests, documentation and teaching, where readability matters more than precision.
Related: Color converter, Color name finder, HEX color picker, Color contrast checker, CMYK to HEX converter.
Start for free or see all free tools. We.Inc is free to start, with no card needed. AI building is on paid plans from $20 a month.
We.Inc is an AI-powered website builder you can resell under your own brand. Launch a branded client dashboard, bill on Stripe Connect, and deliver AI-generated websites in minutes. White-label plans start at $99 a month for 25 client sites, with a 7-day free trial and no per-site fees.