Таблица цветовых кодов RGB
Палитра цветов RGB
Таблица цветовых кодов RGB
Наведите курсор на цвет, чтобы получить шестнадцатеричный и десятичный цветовые коды ниже:
| Шестнадцатеричный: # |
| Красный: |
| Зеленый: |
| Синий: |
Цветовое пространство RGB
Красный, зеленый и синий используют по 8 бит каждый, которые имеют целочисленные значения от 0 до 255. Это дает 256 * 256 * 256 = 16777216 возможных цветов.
RGB ≡ красный, зеленый, синий
Таким образом, каждый пиксель на светодиодном мониторе отображает цвета за счет комбинации красного, зеленого и синего светодиодов (светоизлучающих диодов).
Когда красный пиксель установлен на 0, светодиод выключен. Когда красный пиксель установлен на 255, светодиод будет полностью включен.
Любое значение между ними устанавливает частичное излучение светодиода.
Цветовой формат и расчет RGB
Код RGB имеет формат 24 бита (биты 0..23):
| КРАСНЫЙ [7: 0] | ЗЕЛЕНЫЙ [7: 0] | СИНИЙ [7: 0] | |||||||||||||||||||||
| 23 | 16 | 15 | 8 | 7 | 0 | ||||||||||||||||||
Примеры расчетов
Белый цвет RGB
White RGB code = 255*65536+255*256+255 = #FFFFFF
Синий цвет RGB
Blue RGB code = 0*65536+0*256+255 = #0000FF
Красный цвет RGB
Red RGB code = 255*65536+0*256+0 = #FF0000
Зеленый цвет RGB
Green RGB code = 0*65536+255*256+0 = #00FF00
Серый цвет RGB
Gray RGB code = 128*65536+128*256+128 = #808080
Желтый цвет RGB
Yellow RGB code = 255*65536+255*256+0 = #FFFF00
2.13. CSS-цвета
Свойство color
1. Приоритетные цвета: свойство color
Свойство задаёт цвет шрифта с помощью различных систем цветопередачи. Свойство описывает цвет текстового содержимого элемента. Кроме того, оно используется для предоставления потенциального косвенного значения (currentColor) для любых других свойств, которые принимают значения цвета.
| color | |
|---|---|
| Значения: | |
| цвет | Задаётся с помощью значений цвета. |
| inherit | Наследует значение свойства от родительского элемента. |
2. Значения цвета
2.1. Основные ключевые слова
Список основных ключевых слов включает в себя следующие значения:
| Название | HEX | RGB | Цвет |
|---|---|---|---|
| black | #000000 | 0,0,0 | |
| silver | #C0C0C0 | 192,192,192 | |
| gray | #808080 | 128,128,128 | |
| white | #FFFFFF | 255,255,255 | |
| maroon | #800000 | 128,0,0 | |
| red | #FF0000 | 255,0,0 | |
| purple | #800080 | 128,0,128 | |
| fuchsia | #FF00FF | 255,0,255 | |
| green | #008000 | 0,128,0 | |
| lime | #00FF00 | 0,255,0 | |
| olive | #808000 | 128,128,0 | |
| yellow | #FFFF00 | 255,255,0 | |
| navy | #000080 | 0,0,128 | |
| blue | #0000FF | 0,0,255 | |
| teal | #008080 | 0,128,128 | |
| aqua | #00FFFF | 0,255,255 |
Названия цветов не чувствительны к регистру.
2.2. Числовые значения цвета
2.2.1. Цвета модели RGB
Символы пробела допускаются вокруг числовых значений.
Все цвета RGB указываются в цветовом пространстве sRGB. Пользовательские агенты могут различаться в точности, с которой они представляют эти цвета, но использование sRGB дает однозначное и объективно измеримое определение того, каким должен быть цвет.
Значения за пределами диапазона устройства должны быть обрезаны или отображены в известном диапазоне: значения красного, зеленого и синего необходимо изменить, чтобы они попадали в диапазон, поддерживаемый устройством. Некоторые устройства, например принтеры, имеют диапазоны, отличные от sRGB, поэтому некоторые цвета за пределами диапазона 0..255 sRGB будут представимы (внутри диапазона устройства) и будут отображаться.
2.2.2. Цвета модели RGBA
Параметр непрозрачности применяется ко всему объекту. Любые значения за пределами диапазона от 0.0 (полностью прозрачный) до 1.0 (полностью непрозрачный) будут ограничены этим диапазоном.
2.2.3. Ключевое слово transparent
2.2.4. HSL-цвета
Цвета RGB не интуитивно понятны. CSS3 добавляет числовые цвета hue-saturation-lightness (HSL) в дополнение к числовым цветам RGB. HSL-цвета симметричны свету и темноте, и преобразование HSL в RGB максимально просто.
Цвета HSL кодируются как тройка (оттенок, насыщенность, яркость). Оттенок представлен как угол цветного круга (то есть радуга, представленная в круге). Этот угол обычно измеряется в градусах, так что эта единица измерения неявна в CSS; синтаксически дается только число. По определению красный = 0 = 360, а остальные цвета распределены по кругу, поэтому зеленый = 120, синий = 240 и т.д. Насыщенность и яркость представлены в процентах. 100% — это полное насыщение, а 0% — это оттенок серого. Яркость 0% — черная, 100% — белая, а 50% — нормальная.
2.2.5. HSLA-значения цвета
2.3. Расширенные ключевые слова цвета
В таблице ниже представлен список цветов, поддерживаемых популярными браузерами.
| Название | HEX | RGB | Цвет |
|---|---|---|---|
| aliceblue | #F0F8FF | 240,248,255 | |
| antiquewhite | #FAEBD7 | 250,235,215 | |
| aqua | #00FFFF | 0,255,255 | |
| aquamarine | #7FFFD4 | 127,255,212 | |
| azure | #F0FFFF | 240,255,255 | |
| beige | #F5F5DC | 245,245,220 | |
| bisque | #FFE4C4 | 255,228,196 | |
| black | #000000 | 0,0,0 | |
| blanchedalmond | #FFEBCD | 255,235,205 | |
| blue | #0000FF | 0,0,255 | |
| blueviolet | #8A2BE2 | 138,43,226 | |
| brown | #A52A2A | 165,42,42 | |
| burlywood | #DEB887 | 222,184,135 | |
| cadetblue | #5F9EA0 | 95,158,160 | |
| chartreuse | #7FFF00 | 127,255,0 | |
| chocolate | #D2691E | 210,105,30 | |
| coral | #FF7F50 | 255,127,80 | |
| cornflowerblue | #6495ED | 100,149,237 | |
| cornsilk | #FFF8DC | 255,248,220 | |
| crimson | #DC143C | 220,20,60 | |
| cyan | #00FFFF | 0,255,255 | |
| darkblue | #00008B | 0,0,139 | |
| darkcyan | #008B8B | 0,139,139 | |
| darkgoldenrod | #B8860B | 184,134,11 | |
| darkgray | #A9A9A9 | 169,169,169 | |
| darkgreen | #006400 | 0,100,0 | |
| darkkhaki | #BDB76B | 189,183,107 | |
| darkmagenta | #8B008B | 139,0,139 | |
| darkolivegreen | #556B2F | 85,107,47 | |
| darkorange | #FF8C00 | 255,140,0 | |
| darkorchid | #9932CC | 153,50,204 | |
| darkred | #8B0000 | 139,0,0 | |
| darksalmon | #E9967A | 233,150,122 | |
| darkseagreen | #8FBC8F | 143,188,143 | |
| darkslateblue | #483D8B | 72,61,139 | |
| darkslategray | #2F4F4F | 47,79,79 | |
| darkturquoise | #00CED1 | 0,206,209 | |
| darkviolet | #9400D3 | 148,0,211 | |
| deeppink | #FF1493 | 255,20,147 | |
| deepskyblue | #00BFFF | 0,191,255 | |
| dimgray | #696969 | 105,105,105 | |
| dodgerblue | #1E90FF | 30,144,255 | |
| firebrick | #B22222 | 178,34,34 | |
| floralwhite | #FFFAF0 | 255,250,240 | |
| forestgreen | #228B22 | 34,139,34 | |
| fuchsia | #FF00FF | 255,0,255 | |
| gainsboro | #DCDCDC | 220,220,220 | |
| ghostwhite | #F8F8FF | 248,248,255 | |
| gold | #FFD700 | 255,215,0 | |
| goldenrod | #DAA520 | 218,165,32 | |
| gray | #808080 | 128,128,128 | |
| green | #008000 | 0,128,0 | |
| greenyellow | #ADFF2F | 173,255,47 | |
| honeydew | #F0FFF0 | 240,255,240 | |
| hotpink | #FF69B4 | 255,105,180 | |
| indianred | #CD5C5C | 205,92,92 | |
| indigo | #4B0082 | 75,0,130 | |
| ivory | #FFFFF0 | 255,255,240 | |
| khaki | #F0E68C | 240,230,140 | |
| lavender | #E6E6FA | 230,230,250 | |
| lavenderblush | #FFF0F5 | 255,240,245 | |
| lawngreen | #7CFC00 | 124,252,0 | |
| lemonchiffon | #FFFACD | 255,250,205 | |
| lightblue | #ADD8E6 | 173,216,230 | |
| lightcoral | #F08080 | 240,128,128 | |
| lightcyan | #E0FFFF | 224,255,255 | |
| lightgoldenrodyellow | #FAFAD2 | 250,250,210 | |
| lightgray | #D3D3D3 | 211,211,211 | |
| lightgreen | #90EE90 | 144,238,144 | |
| lightpink | #FFB6C1 | 255,182,193 | |
| lightsalmon | #FFA07A | 255,160,122 | |
| lightseagreen | #20B2AA | 32,178,170 | |
| lightskyblue | #87CEFA | 135,206,250 | |
| lightslategray | #778899 | 119,136,153 | |
| lightsteelblue | #B0C4DE | 176,196,222 | |
| lightyellow | #FFFFE0 | 255,255,224 | |
| lime | #00FF00 | 0,255,0 | |
| limegreen | #32CD32 | 50,205,50 | |
| linen | #FAF0E6 | 250,240,230 | |
| magenta | #FF00FF | 255,0,255 | |
| maroon | #800000 | 128,0,0 | |
| mediumaquamarine | #66CDAA | 102,205,170 | |
| mediumblue | #0000CD | 0,0,205 | |
| mediumorchid | #BA55D3 | 186,85,211 | |
| mediumpurple | #9370DB | 147,112,219 | |
| mediumseagreen | #3CB371 | 60,179,113 | |
| mediumslateblue | #7B68EE | 123,104,238 | |
| mediumspringgreen | #00FA9A | 0,250,154 | |
| mediumturquoise | #48D1CC | 72,209,204 | |
| mediumvioletred | #C71585 | 199,21,133 | |
| midnightblue | #191970 | 25,25,112 | |
| mintcream | #F5FFFA | 245,255,250 | |
| mistyrose | #FFE4E1 | 255,228,225 | |
| moccasin | #FFE4B5 | 255,228,181 | |
| navajowhite | #FFDEAD | 255,222,173 | |
| navy | #000080 | 0,0,128 | |
| oldlace | #FDF5E6 | 253,245,230 | |
| olive | #808000 | 128,128,0 | |
| olivedrab | #6B8E23 | 107,142,35 | |
| orange | #FFA500 | 255,165,0 | |
| orangered | #FF4500 | 255,69,0 | |
| orchid | #DA70D6 | 218,112,214 | |
| palegoldenrod | #EEE8AA | 238,232,170 | |
| palegreen | #98FB98 | 152,251,152 | |
| paleturquoise | #AFEEEE | 175,238,238 | |
| palevioletred | #DB7093 | 219,112,147 | |
| papayawhip | #FFEFD5 | 255,239,213 | |
| peachpuff | #FFDAB9 | 255,218,185 | |
| peru | #CD853F | 205,133,63 | |
| pink | #FFC0CB | 255,192,203 | |
| plum | #DDA0DD | 221,160,221 | |
| powderblue | #B0E0E6 | 176,224,230 | |
| purple | #800080 | 128,0,128 | |
| red | #FF0000 | 255,0,0 | |
| rosybrown | #BC8F8F | 188,143,143 | |
| royalblue | #4169E1 | 65,105,225 | |
| saddlebrown | #8B4513 | 139,69,19 | |
| salmon | #FA8072 | 250,128,114 | |
| sandybrown | #F4A460 | 244,164,96 | |
| seagreen | #2E8B57 | 46,139,87 | |
| seashell | #FFF5EE | 255,245,238 | |
| sienna | #A0522D | 160,82,45 | |
| silver | #C0C0C0 | 192,192,192 | |
| skyblue | #87CEEB | 135,206,235 | |
| slateblue | #6A5ACD | 106,90,205 | |
| slategray | #708090 | 112,128,144 | |
| snow | #FFFAFA | 255,250,250 | |
| springgreen | #00FF7F | 0,255,127 | |
| steelblue | #4682B4 | 70,130,180 | |
| tan | #D2B48C | 210,180,140 | |
| teal | #008080 | 0,128,128 | |
| thistle | #D8BFD8 | 216,191,216 | |
| tomato | #FF6347 | 255,99,71 | |
| turquoise | #40E0D0 | 64,224,208 | |
| violet | #EE82EE | 238,130,238 | |
| wheat | #F5DEB3 | 245,222,179 | |
| white | #FFFFFF | 255,255,255 | |
| whitesmoke | #F5F5F5 | 245,245,245 | |
| yellow | #FFFF00 | 255,255,0 | |
| yellowgreen | #9ACD32 | 154,205,50 |
2.4. Ключевое слово currentColor
Цвета HTML
Одной из составляющих представления веб-страниц в интернете является цвет, современные браузеры принимают и воспроизводят его, используя цветовые модели RGB, HSL, или же ключевые слова (названия).
Значения цвета в HTML может быть задано одним из следующих способов.
Имена цветов CSS, SVG.
В отличие от Html, в котором стандартными являются 16 цветов, спецификации CSS и SVG, определяют более расширенный список имен, состоящий из 147 названий. Однако, несмотря на наличие в списке сто сорока семи наименований, оригинальные значения имеют только 138, так как все серые цвета могут быть указаны как через «a», так и через «e» (grAy или grEy), а fuchsia и aqua имеют альтернативные имена: magenta и cyan соответственно (последние не поддерживаются HTML 4.01).
Приведенная ниже таблица представляет имена цветов и их значения в HSL и HEX. При использовании имен, следует помнить, что синтаксис SVG отличается от HTML и CSS: атрибут fill, к примеру, применяется как к цвету текста (color), так и объекта (background-color), а stroke используются для задания контура (обводки) элемента.
| Имя | R G B | H S L |
|---|---|---|
| white | #ffffffhex | 0°, 0%, 100% |
| ivory | #fffff0hex | 60°, 100%, 97% |
| lightyellow | #ffffe0hex | 60°, 100%, 94% |
| yellow | #ffff00hex | 60°, 100%, 50% |
| snow | #fffafahex | 0°, 100%, 99% |
| floralwhite | #fffaf0hex | 40°, 100%, 97% |
| lemonchiffon | #fffacdhex | 54°, 100%, 90% |
| cornsilk | #fff8dchex | 48°, 100%, 93% |
| seashell | #fff5eehex | 25°, 100%, 97% |
| lavenderblush | #fff0f5hex | 340°, 100%, 97% |
| papayawhip | #ffefd5hex | 37°, 100%, 92% |
| blanchedalmond | #ffebcdhex | 36°, 100%, 90% |
| mistyrose | #ffe4e1hex | 6°, 100%, 94% |
| bisque | #ffe4c4hex | 33°, 100%, 88% |
| moccasin | #ffe4b5hex | 38°, 100%, 86% |
| navajowhite | #ffdeadhex | 36°, 100%, 84% |
| peachpuff | #ffdab9hex | 28°, 27%, 100% |
| gold | #ffd700hex | 51°, 100%, 50% |
| pink | #ffc0cbhex | 350°, 100%, 88% |
| lightpink | #ffb6c1hex | 351°, 100%, 86% |
| orange | #ffa500hex | 39°, 100%, 50% |
| lightsalmon | #ffa07ahex | 17°, 100%, 74% |
| darkorange | #ff8c00hex | 33°, 100%, 50% |
| coral | #ff7f50hex | 16°, 100%, 66% |
| hotpink | #ff69b4hex | 330°, 100%, 71% |
| tomato | #ff6347hex | 9°, 100%, 64% |
| orangered | #ff4500hex | 16°, 100%, 50% |
| deeppink | #ff1493hex | 328°, 100%, 54% |
| magenta, fuchsia | #ff00ffhex | 300°, 100%, 50% |
| red | #ff0000hex | 0°, 100%, 50% |
| oldlace | #fdf5e6hex | 39°, 85%, 95% |
| lightgoldenrodyellow | #fafad2hex | 60°, 80%, 90% |
| linen | #faf0e6hex | 30°, 67%, 94% |
| antiquewhite | #faebd7hex | 34°, 78%, 91% |
| salmon | #fa8072hex | 6°, 93%, 71% |
| ghostwhite | #f8f8ffhex | 240°, 100%, 99% |
| mintcream | #f5fffahex | 150°, 100%, 98% |
| whitesmoke | #f5f5f5hex | 0°, 0%, 96% |
| beige | #f5f5dchex | 60°, 56%, 91% |
| wheat | #f5deb3hex | 39°, 77%, 83% |
| sandybrown | #f4a460hex | 28°, 87%, 67% |
| azure | #f0ffffhex | 180°, 100%, 97% |
| honeydew | #f0fff0hex | 120°, 100%, 97% |
| aliceblue | #f0f8ffhex | 208°, 100%, 97% |
| khaki | #f0e68chex | 54°, 77%, 75% |
| lightcoral | #f08080hex | 0°, 79%, 72% |
| palegoldenrod | #eee8aahex | 55°, 67%, 80% |
| violet | #ee82eehex | 300°, 76%, 72% |
| darksalmon | #e9967ahex | 15°, 72%, 70% |
| lavender | #e6e6fahex | 240°, 67%, 94% |
| lightcyan | #e0ffffhex | 180°, 100%, 94% |
| burlywood | #deb887hex | 34°, 57%, 70% |
| plum | #dda0ddhex | 300°, 47%, 75% |
| gainsboro | #dcdcdchex | 0°, 0%, 86% |
| crimson | #dc143chex | 348°, 83%, 47% |
| palevioletred | #db7093hex | 340°, 60%, 65% |
| goldenrod | #daa520hex | 43°, 74%, 49% |
| orchid | #da70d6hex | 302°, 59%, 65% |
| thistle | #d8bfd8hex | 300°, 24%, 80% |
| lightgray, lightgrey | #d3d3d3hex | 0°, 0%, 83% |
| tan | #d2b48chex | 34°, 44%, 67% |
| chocolate | #d2691ehex | 25°, 75%, 47% |
| peru | #cd853fhex | 30°, 59%, 53% |
| indianred | #cd5c5chex | 0°, 53%, 58% |
| mediumvioletred | #c71585hex | 322°, 81%, 43% |
| silver | #c0c0c0hex | 0°, 0%, 75% |
| darkkhaki | #bdb76bhex | 56°, 38%, 58% |
| rosybrown | #bc8f8fhex | 0°, 25%, 65% |
| mediumorchid | #ba55d3hex | 288°, 59%, 58% |
| darkgoldenrod | #b8860bhex | 43°, 89%, 38% |
| firebrick | #b22222hex | 0°, 68%, 42% |
| powderblue | #b0e0e6hex | 187°, 52%, 80% |
| lightsteelblue | #b0c4dehex | 214°, 41%, 78% |
| paleturquoise | #afeeeehex | 180°, 65%, 81% |
| greenyellow | #adff2fhex | 84°, 100%, 59% |
| lightblue | #add8e6hex | 195°, 53%, 79% |
| darkgray, darkgrey | #a9a9a9hex | 0°, 0%, 66% |
| brown | #a52a2ahex | 0°, 59%, 41% |
| sienna | #a0522dhex | 19°, 56%, 40% |
| yellowgreen | #9acd32hex | 80°, 61%, 50% |
| darkorchid | #9932cchex | 280°, 61%, 50% |
| palegreen | #98fb98hex | 120°, 93%, 79% |
| darkviolet | #9400d3hex | 282°, 100%, 41% |
| mediumpurple | #9370dbhex | 260°, 60%, 65% |
| lightgreen | #90ee90hex | 120°, 73%, 75% |
| darkseagreen | #8fbc8fhex | 120°, 25%, 65% |
| saddlebrown | #8b4513hex | 25°, 76%, 31% |
| darkmagenta | #8b008bhex | 300°, 100%, 27% |
| darkred | #8b0000hex | 0°, 100%, 27% |
| blueviolet | #8a2be2hex | 271°, 76%, 53% |
| lightskyblue | #87cefahex | 203°, 92%, 76% |
| skyblue | #87ceebhex | 197°, 71%, 73% |
| gray, grey | #808080hex | 0°, 0%, 50% |
| olive | #808000hex | 60°, 100%, 25% |
| purple | #800080hex | 300°, 100%, 25% |
| maroon | #800000hex | 0°, 100%, 25% |
| aquamarine | #7fffd4hex | 160°, 100%, 75% |
| chartreuse | #7fff00hex | 90°, 100%, 50% |
| lawngreen | #7cfc00hex | 91°, 100%, 4% |
| mediumslateblue | #7b68eehex | 249°, 80%, 67% |
| lightslategray, lightslategrey | #778899hex | 210°, 14%, 53% |
| slategray или slategrey | #708090hex | 210°, 13%, 50% |
| olivedrab | #6b8e23hex | 80°, 61%, 35% |
| slateblue | #6a5acdhex | 248°, 54%, 58% |
| dimgray, dimgrey | #696969hex | 0°, 0%, 41% |
| mediumaquamarine | #66cdaahex | 160°, 51%, 60% |
| rebeccapurple | #663399hex | 270°, 50%, 40% |
| cornflowerblue | #6495edhex | 219°, 79%, 66% |
| cadetblue | #5f9ea0hex | 182°, 26%, 50% |
| darkolivegreen | #556b2fhex | 82°, 39%, 30% |
| indigo | #4b0082hex | 275°, 100%, 26% |
| mediumturquoise | #48d1cchex | 178°, 60%, 55% |
| darkslateblue | #483d8bhex | 249°, 39%, 39% |
| steelblue | #4682b4hex | 207°, 44%, 49% |
| royalblue | #4169e1hex | 225°, 73%, 57% |
| turquoise | #40e0d0hex | 174°, 72%, 57% |
| mediumseagreen | #3cb371hex | 147°, 50%, 47% |
| limegreen | #32cd32hex | 120°, 61%, 50% |
| darkslategray, darkslategrey | #2f4f4fhex | 180°, 25%, 25% |
| seagreen | #2e8b57hex | 147°, 50%, 36% |
| forestgreen | #228b22hex | 120°, 61%, 34% |
| lightseagreen | #20b2aahex | 177°, 70%, 41% |
| dodgerblue | #1e90ffhex | 210°, 100%, 56% |
| midnightblue | #191970hex | 240°, 64%, 27% |
| aqua, cyan | #00ffffhex | 180°, 100%, 50% |
| springgreen | #00ff7fhex | 150°, 100%, 50% |
| lime | #00ff00hex | 120°, 100%, 50% |
| mediumspringgreen | #00fa9ahex | 157°, 100%, 49% |
| darkturquoise | #00ced1hex | 181°, 100%, 41% |
| deepskyblue | #00bfffhex | 195°, 100%, 50% |
| darkcyan | #008b8bhex | 180°, 100%, 27% |
| teal | #008080hex | 180°, 100%, 25% |
| green | #008000hex | 120°, 100%, 25% |
| darkgreen | #006400hex | 120°, 100%, 20% |
| blue | #0000ffhex | 240°, 100%, 50% |
| mediumblue | #0000cdhex | 240°, 100%, 40% |
| darkblue | #00008bhex | 240°, 100%, 27% |
| navy | #000080hex | 240°, 100%, 25% |
| black | #000000hex | 0°, 0%, 0% |
Для получения информации о других цветах и значениях в HEX, HEX8, RGB, RGB%, CMYK, HSL, HSV воспользуйтесь калькулятором цветов.
