Основные цвета
- Silver
- #C0C0C0
- 192, 192, 192
- White
- #FFFFFF
- 255, 255, 255
- Fuchsia
- #FF00FF
- 255, 0, 255
Красные тона
- IndianRed
- #CD5C5C
- 205, 92, 92
- LightCoral
- #F08080
- 240, 128, 128
- Salmon
- #FA8072
- 250, 128, 114
- DarkSalmon
- #E9967A
- 233, 150, 122
- LightSalmon
- #FFA07A
- 255, 160, 122
- Crimson
- #DC143C
- 220, 20, 60
- FireBrick
- #B22222
- 178, 34, 34
Зеленые тона
- GreenYellow
- #ADFF2F
- 173, 255, 47
- Chartreuse
- #7FFF00
- 127, 255, 0
- LawnGreen
- #7CFC00
- 124, 252, 0
- LimeGreen
- #32CD32
- 50, 205, 50
- PaleGreen
- #98FB98
- 152, 251, 152
- LightGreen
- #90EE90
- 144, 238, 144
- MediumSpringGreen
- #00FA9A
- 0, 250, 154
- SpringGreen
- #00FF7F
- 0, 255, 127
- MediumSeaGreen
- #3CB371
- 60, 179, 113
- SeaGreen
- #2E8B57
- 46, 139, 87
- ForestGreen
- #228B22
- 34, 139, 34
- DarkGreen
- #006400
- 0, 100, 0
- YellowGreen
- #9ACD32
- 154, 205, 50
- OliveDrab
- #6B8E23
- 107, 142, 35
- DarkOliveGreen
- #556B2F
- 85, 107, 47
- MediumAquamarine
- #66CDAA
- 102, 205, 170
- DarkSeaGreen
- #8FBC8F
- 143, 188, 143
- LightSeaGreen
- #20B2AA
- 32, 178, 170
- DarkCyan
- #008B8B
- 0, 139, 139
Розовые тона
- LightPink
- #FFB6C1
- 255, 182, 193
- HotPink
- #FF69B4
- 255, 105, 180
- DeepPink
- #FF1493
- 255, 20, 147
- MediumVioletRed
- #C71585
- 199, 21, 133
- PaleVioletRed
- #DB7093
- 219, 112, 147
Оранжевые тона
- LightSalmon
- #FFA07A
- 255, 160, 122
- OrangeRed
- #FF4500
- 255, 69, 0
- DarkOrange
- #FF8C00
- 255, 140, 0
Желтые тона
- LightYellow
- #FFFFE0
- 255, 255, 224
- LemonChiffon
- #FFFACD
- 255, 250, 205
- LightGoldenrodYellow
- #FAFAD2
- 250, 250, 210
- PapayaWhip
- #FFEFD5
- 255, 239, 213
- Moccasin
- #FFE4B5
- 255, 228, 181
- PeachPuff
- #FFDAB9
- 255, 218, 185
- PaleGoldenrod
- #EEE8AA
- 238, 232, 170
- Khaki
- #F0E68C
- 240, 230, 140
- DarkKhaki
- #BDB76B
- 189, 183, 107
Синие тона
- LightCyan
- #E0FFFF
- 224, 255, 255
- PaleTurquoise
- #AFEEEE
- 175, 238, 238
- Aquamarine
- #7FFFD4
- 127, 255, 212
- Turquoise
- #40E0D0
- 64, 224, 208
- MediumTurquoise
- #48D1CC
- 72, 209, 204
- DarkTurquoise
- #00CED1
- 0, 206, 209
- CadetBlue
- #5F9EA0
- 95, 158, 160
- SteelBlue
- #4682B4
- 70, 130, 180
- LightSteelBlue
- #B0C4DE
- 176, 196, 222
- PowderBlue
- #B0E0E6
- 176, 224, 230
- LightBlue
- #ADD8E6
- 173, 216, 230
- SkyBlue
- #87CEEB
- 135, 206, 235
- LightSkyBlue
- #87CEFA
- 135, 206, 250
- DeepSkyBlue
- #00BFFF
- 0, 191, 255
- DodgerBlue
- #1E90FF
- 30, 144, 255
- CornflowerBlue
- #6495ED
- 100, 149, 237
- MediumSlateBlue
- #7B68EE
- 123, 104, 238
- RoyalBlue
- #4169E1
- 65, 105, 225
- MediumBlue
- #0000CD
- 0, 0, 205
- MidnightBlue
- #191970
- 25, 25, 112
Фиолетовые тона
- Lavender
- #E6E6FA
- 230, 230, 250
- Thistle
- #D8BFD8
- 216, 191, 216
- Violet
- #EE82EE
- 238, 130, 238
- Orchid
- #DA70D6
- 218, 112, 214
- Fuchsia
- #FF00FF
- 255, 0, 255
- Magenta
- #FF00FF
- 255, 0, 255
- MediumOrchid
- #BA55D3
- 186, 85, 211
- MediumPurple
- #9370DB
- 147, 112, 219
- BlueViolet
- #8A2BE2
- 138, 43, 226
- DarkViolet
- #9400D3
- 148, 0, 211
- DarkOrchid
- #9932CC
- 153, 50, 204
- DarkMagenta
- #8B008B
- 139, 0, 139
- SlateBlue
- #6A5ACD
- 106, 90, 205
- DarkSlateBlue
- #483D8B
- 72, 61, 139
Белые тона
- White
- #FFFFFF
- 255, 255, 255
- Honeydew
- #F0FFF0
- 240, 255, 240
- MintCream
- #F5FFFA
- 245, 255, 250
- Azure
- #F0FFFF
- 240, 255, 255
- AliceBlue
- #F0F8FF
- 240, 248, 255
- GhostWhite
- #F8F8FF
- 248, 248, 255
- WhiteSmoke
- #F5F5F5
- 245, 245, 245
- Seashell
- #FFF5EE
- 255, 245, 238
- Beige
- #F5F5DC
- 245, 245, 220
- OldLace
- #FDF5E6
- 253, 245, 230
- FloralWhite
- #FFFAF0
- 255, 250, 240
- Ivory
- #FFFFF0
- 255, 255, 240
- AntiqueWhite
- #FAEBD7
- 250, 235, 215
- Linen
- #FAF0E6
- 250, 240, 230
- LavenderBlush
- #FFF0F5
- 255, 240, 245
- MistyRose
- #FFE4E1
- 255, 228, 225
Коричневые тона
- Cornsilk
- #FFF8DC
- 255, 248, 220
- BlanchedAlmond
- #FFEBCD
- 255, 235, 205
- Bisque
- #FFE4C4
- 255, 228, 196
- NavajoWhite
- #FFDEAD
- 255, 222, 173
- Wheat
- #F5DEB3
- 245, 222, 179
- BurlyWood
- #DEB887
- 222, 184, 135
- RosyBrown
- #BC8F8F
- 188, 143, 143
- SandyBrown
- #F4A460
- 244, 164, 96
- Goldenrod
- #DAA520
- 218, 165, 32
- DarkGoldenRod
- #B8860B
- 184, 134, 11
- Chocolate
- #D2691E
- 210, 105, 30
- SaddleBrown
- #8B4513
- 139, 69, 19
Серые тона
- Gainsboro
- #DCDCDC
- 220, 220, 220
- LightGrey
- #D3D3D3
- 211, 211, 211
- LightGray
- #D3D3D3
- 211, 211, 211
- Silver
- #C0C0C0
- 192, 192, 192
- DarkGray
- #A9A9A9
- 169, 169, 169
- DarkGrey
- #A9A9A9
- 169, 169, 169
- DimGray
- #696969
- 105, 105, 105
- DimGrey
- #696969
- 105, 105, 105
- LightSlateGray
- #778899
- 119, 136, 153
- LightSlateGrey
- #778899
- 119, 136, 153
- SlateGray
- #708090
- 112, 128, 144
- SlateGrey
- #708090
- 112, 128, 144
- DarkSlateGray
- #2F4F4F
- 47, 79, 79
- DarkSlateGrey
- #2F4F4F
- 47, 79, 79
Шестнадцатеричные значения
Шестнадцатеричные значения цвета поддерживается всеми основными браузерами. Цвет с использованием шестнадцатеричной системы задается с использованием следующего синтаксиса:
селектор { цвет : #RRGGBB; } #RR (красный) #GG (зеленый) #BB (синий)
Значение, фактически содержит три шестнадцатеричных числа (RR - для красного, GG - для зеленого, BB - для синего). Каждое значение (RR, GG и BB) должно находиться в диапозоне между 00 и FF. В шестнадцатиричной системе счет ведется следующим образом: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, А, B, С, D, Е, F.Р>
<Р>Например, значение #число 0000ff соответствует синему цвету, так как компонент ББ установлен в его самое высокое значение - (ФФ), а другие установлены в самое низкое значение (00). Значение, фактически содержит три шестнадцатеричных числа, значение цвета получается при смешивании трех вышеуказанных составляющих.
Обращаю Ваше внимание, что допускается сокращать шестнадцатеричные числа до трех символов, в том случае если каждое из трех двухзначных чисел содержит одинаковые символы. Например, #0000FF можно записывать как #00F, или значение #777777 можно указать следующим образом:
p.вступление { цвет : #777; /* задаём темно-серый цвет для всех абзацев с классом вступление */ }
Зеленые цвета
- газон # 7CFC00 RGB (124,252,0)
- шартрез # 7FFF00 RGB (127,255,0)
- салатовый # 32CD32 RGB (50,205,50)
- Лайм # 00FF00 RGB (0,255,0)
- зеленый лес # 228B22 RGB (34,139,34)
- зеленый # 008000 RGB (0,128,0)
- темно-зеленый # 006400 rgb (0,100,0)
- желто-зеленый # ADFF2F RGB (173,255,47)
- желтый зеленый # 9ACD32 RGB (154,205,50)
- весенне-зеленый # 00FF7F RGB (0,255,127)
- средний весенний # 00FA9A RGB (0,250,154)
- светло-зеленый # 90EE90 RGB (144 238 144)
- бледно-зеленый # 98FB98 RGB (152 251 152)
- темно-зеленый # 8FBC8F RGB (143 188 143)
- средний # 3CB371 RGB (60 179 113)
- цвет морской волны # 2E8B57 RGB (46,139,87)
- оливковый # 808000 RGB (128,128,0)
- темно-оливковый # 556B2F RGB (85,107,47)
- оливковый # 6B8E23 RGB (107,142,35)
Internet Explorer Chrome Opera Safari Firefox Android iOS
4.0+ 1.0+ 3.5+ 1.3+ 1.0+ 1.0+ 1.0+ em>
Браузеры поддерживают некоторые цвета по их названию. В табл. 1 и описание, шестнадцатеричный код, значения в формате RGB, HSL и описание.
- белый #ffffff или #fff rgb(255,255,255) hsl(0,0%,100%) Белый
- серебро #c0c0c0 rgb(192,192,192) hsl(0,0%,75%) Серый
- серый #808080 rgb(128,128,128) hsl(0,0%,50%) Темно-серый
- черный #000000 или #000 rgb(0,0,0) hsl(0,0%,0%) Черный
- бордовый #800000 rgb(128,0,0) hsl(0,100%,25%) Темно-красный
- красный #ff0000 или #f00 rgb(255,0,0) hsl(0,100%,50%) Красный
- оранжевый #ffa500 rgb(255,165,0) hsl(38,8,100%,50%) Оранжевый
- желтый #ffff00 или #ff0 rgb(255,255,0) hsl(60,100%,50%) Желтый
- оливковый #808000 rgb(128,128,0) hsl(60,100%,25%) Оливковый
- лайм #00ff00 или #0f0 rgb(0,255,0) hsl(120,100%,50%) Светло-зеленый
- зеленый #008000 rgb(0,128,0) hsl(120,100%,25%) Зеленый
- aqua #00ffff или #0ff rgb(0,255,255) hsl(180,100%,50%) или
- синий #0000ff или #00f rgb(0,0,255) hsl(240,100%,50%) Синий
- темно-синий #000080 rgb(0,0,128) hsl(240,100%,25%) Темно-синий
- бирюзовый #008080 rgb(0,128,128) hsl(180,100%,25%) Сине-зеленый
- фуксия #ff00ff или #f0f rgb(255,0,255) hsl(300,100%,50%) Розовый
- фиолетовый #800080 rgb(128,0,128) hsl(300,100%,25%) Фиолетовый
Розовые цвета
- розовый # FFC0CB RGB (255 192 203)
- светло-розовый # FFB6C1 RGB (255 182 193)
- ярко-розовый # FF69B4 RGB (255 105 180)
- темно-розовый # FF1493 RGB (255, 20, 147)
- бледно-фиолетовый # DB7093 RGB (219 112 147)
- среднефиолетовый # C71585 RGB (199,21,133)
Спецификация
Каждая спецификация проходит несколько стадий одобрения.
Рекомендация (Рекомендация) - спецификация одобрена W3C и рекомендована как стандарт.
<Р>рекомендации кандидата (Возможная рекомендация) — не группа, отвечающая за стандарт, удовлетворена, как он соответствует своим целям, но требуется помощь сообщества разработчиков по реализации стандарта.Р>
Предлагаемая рекомендация (Предлагаемая рекомендация) - на этом этапе документ представлен на рассмотрение Консультативного совета W3C для окончательного утверждения.
Рабочий проект (Рабочий проект) — более зрелая версия черновика после обсуждения и внесения поправок для рассмотрения сообществом.
Редакторский черновик (Редакторский черновик) — черновая версия стандарта после внесения правок редакторами проекта.
Черновик (Черновик спецификации) — первая черновая версия стандарта.
Серые цвета
- Гейнсборо #DCDCDC RGB (220,220,220)
- светло-серый # D3D3D3 RGB (211 211 211)
- Серебряный # C0C0C0 RGB (192,192,192)
- темно-серый # A9A9A9 RGB (169 169 169)
- серый # 808080 RGB (128,128,128)
- тусклый # 696969 RGB (105 105 105)
- свет # 778899 RGB (119,136,153)
- шифер серый # 708090 rgb (112,128,144)
- темно-серый # 2F4F4F RGB (47,79,79)
- черный # 000000 rgb (0,0,0)
Короткий шестнадцатеричный код цвета — это более короткая форма шестизначной нотации. В этом формате каждая цифра повторяется, чтобы получить эквивалентное шестизначное значение цвета. Например: #0F0 становится #00FF00.
Шестнадцатеричное значение может быть взято из любого графического программного обеспечения, такого как Adobe Photoshop, Core Draw и др.
Каждому шестнадцатеричному коду цвета в CSS будет предшествовать знак хеша «#». Ниже приведены примеры использования шестнадцатеричных обозначений.
Цветовые модели HSL и HSLA
К еще одному методу задания цвета в CSS относится система , её можно значительно реже встретить на страницах сайтов. HSL это аббревиатура, которая объединяет в себе первые буквы трех следующих признаков:
Оттенок — тон.
Насыщенность — насыщенность.
Легкость — осветленность.
Цвет ссылок
Цвет ссылки меняется похожим образом, только в качестве селектора нужно указать <a>:
a { цвет: красный; }
Если нужно менять цвет при наведении, тогда добавляем псевдо-класс :наведите курсор мыши:
a:наведите курсор мыши { цвет: #A52A2A; }
Синие цвета
- синий порошок # B0E0E6 rgb (176,224,230)
- светло-синий # ADD8E6 RGB (173 216 230)
- светнебосиний # 87CEFA RGB (135 206 250)
- голубое небо # 87CEEB RGB (135 206 235)
- темно-синий # 00BFFF RGB (0,191,255)
- светстальсиний # B0C4DE RGB (176 196 222)
- голубой # 1E90FF RGB (30,144,255)
- васильковый # 6495ED RGB (100 149 237)
- стальной синий # 4682B4 RGB (70 130 180)
- Королевский синий # 4169E1 RGB (65,105,225)
- синий # 0000FF RGB (0,0,255)
- средне-синий # 0000CD RGB (0,0,205)
- темно-синий # 00008B RGB (0,0,139)
- флот # 000080 RGB (0,0,128)
- темно-синий # 191970 RGB (25,25,112)
- средний # 7B68EE RGB (123 104 238)
- сланцево-синий # 6A5ACD RGB (106,90,205)
- темно-синий # 483D8B RGB (72,61,139)
Голубые цвета
- светло-голубой # E0FFFF RGB (224,255,255)
- голубой # 00FFFF RGB (0,255,255)
- аква # 00FFFF RGB (0,255,255)
- Аквамарин # 7FFFD4 rgb (127,255,212)
- среднийаквамарин # 66CDAA RGB (102 205 170)
- палитра бирюза #AFEEEE RGB (175 238 238)
- бирюзовый # 40E0D0 RGB (64 224 208)
- средняя бирюза # 48D1CC RGB (72 209 204)
- темно-бирюзовый # 00CED1 RGB (0,206,209)
- свет # 20B2AA RGB (32 178 170)
- кадетсиний # 5F9EA0 RGB (95 158 160)
- темно-синий # 008B8B RGB (0,139,139)
- бирюзовый # 008080 RGB (0,128,128)
RGB и RGBA
Система RGB использует три числа,Система, зеленого и синего цветов, которые смешаны вместе для получения любого оттенка. Числа могут варьироваться от 0 до 255. Рассмотрим РГБ-код для темно-фиолетового цвета: РГБ(204, 51, 255), его можно например применить к УСБ свойству, отвечающему за цвет шрифта:Р>
цвет: rgb(205, 51, 255); p>
<Р>Система RGBA и добавляет еще одно число, которое описывает прозрачность цвета, значение может варьироваться от 0 (полностью прозрачный) до 1 (полностью непрозрачный). Значение 0.5 цвет делает полупрозрачным, рассмотрим версию темно-фиолетового цвета полупрозрачную, заданную с помощью формата RGBA системы:Р>
цвет: rgba(204, 51, 255, 0.5); p>
Вы можете увидеть, что значения красного, зеленого и синего цветов аналогичны системе RGB. Четвертое число - 0.5 является степенью прозрачности. Буква "A" в RGBA означает альфа-канал, который является термином из графического дизайна означающим прозрачность.
RGBA цвета удобно использовать для создания полупрозрачных элементов, обеспечивающих видимость элементов, располагающихся под ними.
Коричневые цвета
- кукурузные рыльца # FFF8DC RGB (255 248 220)
- бланшированный миндаль #FFEBCD RGB (255 235 205)
- бисквит # FFE4C4 RGB (255 228 196)
- навайовайт #FFDEAD rgb (255 222 173)
- пшеница # F5DEB3 RGB (245 222 179)
- Burlywood # DEB887 RGB (222 184 135)
- загар # D2B48C RGB (210,180,140)
- розово-коричневый # BC8F8F RGB (188 143 143)
- песочно-коричневый # F4A460 RGB (244,164,96)
- золотарник # DAA520 RGB (218,165,32)
- Перу # CD853F RGB (205,133,63)
- шоколад # D2691E RGB (210,105,30)