Цвета html обозначаются шестью символами после символа слеш – например, #000000. Эти шесть символов обозначают доли различных цветов (Красного, Зеленого и Синего цветов (Red, Green, Blue)) в итоговом цвете. В мониторе вашего комьютера изображение формируется из огромного количества точек, называемых пикселями. Каждый пиксел – это маленький источник света, назовём его "фонарик", который в свою очередь состоит из трех фонариков – красного, зеленого и синего цвета. Уменьшая или увеличивая интенсивность свечения отдельных цветных фонариков, мы получаем нужный цвет.
Коды цветов html
Цвета в HTML обозначаются шестнадцатиричным (HEX) обозначением сочетания красного, синего и зеленого цвета (RGB).
Наименьшим значением цвета является 0 (шестнадцатиричное 00). Наибольшим значением цвета является 255 (шестнадцатиричное FF).
Шестнадцатиричное значение цвета представляет из себя три цифры, начинающиеся со знака #.
Коды (значения) цветов
Цвет | Код HEX | Код RGB |
---|---|---|
#000000 | rgb(0,0,0) | |
#FF0000 | rgb(255,0,0) | |
#00FF00 | rgb(0,255,0) | |
#0000FF | rgb(0,0,255) | |
#FFFF00 | rgb(255,255,0) | |
#00FFFF | rgb(0,255,255) | |
#FF00FF | rgb(255,0,255) | |
#C0C0C0 | rgb(192,192,192) | |
#FFFFFF | rgb(255,255,255) |
16 миллионов оттенков
Сочетание красного, синего и зеленого цветов со значениями с долей каждого цвета от 0 до 255 дают в сумме более 16 миллионов оттенков (256 x 256 x 256).
Большинство современных мониторов способны отобразить не меньше 16384 различных оттенков (ЖК-мониторы, в основном, способны отображать 262 тысячи 16 миллионов (обновлено в октябре 2013 г.) цветов, а ЭЛТ-мониторы способны отображать практически неограниченное количество цветов).
В цветовой таблице ниже приведено изменение доли красного цвета с 0 до 255 при нулевых значениях синего и зеленого цветов:
Красный | Код HEX | Код RGB |
---|---|---|
#000000 | rgb(0,0,0) | |
#080000 | rgb(8,0,0) | |
#100000 | rgb(16,0,0) | |
#180000 | rgb(24,0,0) | |
#200000 | rgb(32,0,0) | |
#280000 | rgb(40,0,0) | |
#300000 | rgb(48,0,0) | |
#380000 | rgb(56,0,0) | |
#400000 | rgb(64,0,0) | |
#480000 | rgb(72,0,0) | |
#500000 | rgb(80,0,0) | |
#580000 | rgb(88,0,0) | |
#600000 | rgb(96,0,0) | |
#680000 | rgb(104,0,0) | |
#700000 | rgb(112,0,0) | |
#780000 | rgb(120,0,0) | |
#800000 | rgb(128,0,0) | |
#880000 | rgb(136,0,0) | |
#900000 | rgb(144,0,0) | |
#980000 | rgb(152,0,0) | |
#A00000 | rgb(160,0,0) | |
#A80000 | rgb(168,0,0) | |
#B00000 | rgb(176,0,0) | |
#B80000 | rgb(184,0,0) | |
#C00000 | rgb(192,0,0) | |
#C80000 | rgb(200,0,0) | |
#D00000 | rgb(208,0,0) | |
#D80000 | rgb(216,0,0) | |
#E00000 | rgb(224,0,0) | |
#E80000 | rgb(232,0,0) | |
#F00000 | rgb(240,0,0) | |
#F80000 | rgb(248,0,0) | |
#FF0000 | rgb(255,0,0) |
Оттенки серого
Для получение оттенков серого цвета используются равные доли всех цветов. Для облегчения выбора нужного цвета мы приводим вам коды оттенков серого цвета
Оттенки серого | Код HEX | Код RGB |
---|---|---|
#000000 | rgb(0,0,0) | |
#080808 | rgb(8,8,8) | |
#101010 | rgb(16,16,16) | |
#181818 | rgb(24,24,24) | |
#202020 | rgb(32,32,32) | |
#282828 | rgb(40,40,40) | |
#303030 | rgb(48,48,48) | |
#383838 | rgb(56,56,56) | |
#404040 | rgb(64,64,64) | |
#484848 | rgb(72,72,72) | |
#505050 | rgb(80,80,80) | |
#585858 | rgb(88,88,88) | |
#606060 | rgb(96,96,96) | |
#686868 | rgb(104,104,104) | |
#707070 | rgb(112,112,112) | |
#787878 | rgb(120,120,120) | |
#808080 | rgb(128,128,128) | |
#888888 | rgb(136,136,136) | |
#909090 | rgb(144,144,144) | |
#989898 | rgb(152,152,152) | |
#A0A0A0 | rgb(160,160,160) | |
#A8A8A8 | rgb(168,168,168) | |
#B0B0B0 | rgb(176,176,176) | |
#B8B8B8 | rgb(184,184,184) | |
#C0C0C0 | rgb(192,192,192) | |
#C8C8C8 | rgb(200,200,200) | |
#D0D0D0 | rgb(208,208,208) | |
#D8D8D8 | rgb(216,216,216) | |
#E0E0E0 | rgb(224,224,224) | |
#E8E8E8 | rgb(232,232,232) | |
#F0F0F0 | rgb(240,240,240) | |
#F8F8F8 | rgb(248,248,248) | |
#FFFFFF | rgb(255,255,255) |
Кросс-браузерные (для всех браузеров) названия цветов html
Коллекция из 150 названий цветов в html, поддерживаемых во всех браузерах.
Стандартизированные названия цветов
Консорциум W3C перечисляет 16 валидных названий цветов для HTML и CSS: aqua (аквамарин), black (черный), blue (синий), fuchsia (фуксиновый), gray (серый), green (зеленый), lime (лайм или салатовый), maroon (каштановый), navy (ультрамарин), olive (оливковый), purple (пурпурный), red (красный), silver (серебристый), teal (сизый), white (белый) и yellow (желтый).
При использовании цветов, не входящих в этот список, правильнее будет использовать их шестнадцатиричный код (HEX) или код RGB.
Безопасные цвета
Несколько лет назад, когда компьютеры могли поддерживать максимум 256 различных цветов, был предложен список из 216 «Безопасных web-цветов» с 40 цветами, зарезервированными для системы.
Эта 216-цветная палитра была создана для того, чтобы правильно отобразить цвета в режиме 256-цветной палитры.
Теперь это не важно, потому что большинство компьютеров во всем мире поддерживают миллионы оттенков цвета. В любом случае вот список этих цветов:
000000 | 000033 | 000066 | 000099 | 0000CC | 0000FF |
003300 | 003333 | 003366 | 003399 | 0033CC | 0033FF |
006600 | 006633 | 006666 | 006699 | 0066CC | 0066FF |
009900 | 009933 | 009966 | 009999 | 0099CC | 0099FF |
00CC00 | 00CC33 | 00CC66 | 00CC99 | 00CCCC | 00CCFF |
00FF00 | 00FF33 | 00FF66 | 00FF99 | 00FFCC | 00FFFF |
330000 | 330033 | 330066 | 330099 | 3300CC | 3300FF |
333300 | 333333 | 333366 | 333399 | 3333CC | 3333FF |
336600 | 336633 | 336666 | 336699 | 3366CC | 3366FF |
339900 | 339933 | 339966 | 339999 | 3399CC | 3399FF |
33CC00 | 33CC33 | 33CC66 | 33CC99 | 33CCCC | 33CCFF |
33FF00 | 33FF33 | 33FF66 | 33FF99 | 33FFCC | 33FFFF |
660000 | 660033 | 660066 | 660099 | 6600CC | 6600FF |
663300 | 663333 | 663366 | 663399 | 6633CC | 6633FF |
666600 | 666633 | 666666 | 666699 | 6666CC | 6666FF |
669900 | 669933 | 669966 | 669999 | 6699CC | 6699FF |
66CC00 | 66CC33 | 66CC66 | 66CC99 | 66CCCC | 66CCFF |
66FF00 | 66FF33 | 66FF66 | 66FF99 | 66FFCC | 66FFFF |
990000 | 990033 | 990066 | 990099 | 9900CC | 9900FF |
993300 | 993333 | 993366 | 993399 | 9933CC | 9933FF |
996600 | 996633 | 996666 | 996699 | 9966CC | 9966FF |
999900 | 999933 | 999966 | 999999 | 9999CC | 9999FF |
99CC00 | 99CC33 | 99CC66 | 99CC99 | 99CCCC | 99CCFF |
99FF00 | 99FF33 | 99FF66 | 99FF99 | 99FFCC | 99FFFF |
CC0000 | CC0033 | CC0066 | CC0099 | CC00CC | CC00FF |
CC3300 | CC3333 | CC3366 | CC3399 | CC33CC | CC33FF |
CC6600 | CC6633 | CC6666 | CC6699 | CC66CC | CC66FF |
CC9900 | CC9933 | CC9966 | CC9999 | CC99CC | CC99FF |
CCCC00 | CCCC33 | CCCC66 | CCCC99 | CCCCCC | CCCCFF |
CCFF00 | CCFF33 | CCFF66 | CCFF99 | CCFFCC | CCFFFF |
FF0000 | FF0033 | FF0066 | FF0099 | FF00CC | FF00FF |
FF3300 | FF3333 | FF3366 | FF3399 | FF33CC | FF33FF |
FF6600 | FF6633 | FF6666 | FF6699 | FF66CC | FF66FF |
FF9900 | FF9933 | FF9966 | FF9999 | FF99CC | FF99FF |
FFCC00 | FFCC33 | FFCC66 | FFCC99 | FFCCCC | FFCCFF |
FFFF00 | FFFF33 | FFFF66 | FFFF99 | FFFFCC | FFFFFF |
Интересное:
Понравилась запись? Сказать "Спасибо" очень просто, поделитесь записью в социальных сетях!
Коды цветов HTML — это шестнадцатеричные триплеты, представляющие цвета красный, зеленый и синий (#RRGGBB). Например, в красном цвете код цвета # FF0000, который является «255» красным, «0» зеленым и «0» синим. Эти цветовые коды можно использовать для изменения цвета фона, текста и таблиц на веб-странице через CSS.
Название цвета | Цветовой код | Название цвета | Цветовой код |
---|---|---|---|
Красный | # FF0000 | Белый | #FFFFFF |
Сине-зелёный | # 00FFFF | Серебряный | # C0C0C0 |
Синий | # 0000FF | Серый или серый | #808080 |
Темно-синий | # 0000A0 | Черный | #000000 |
Светло-синий | # ADD8E6 | Оранжевый | # FFA500 |
Пурпурный | #800080 | Коричневый | # A52A2A |
Желтый | # FFFF00 | Каштановый | #800000 |
известь | # 00FF00 | Зеленый | #008000 |
Fuxin | # FF00FF | Оливковый | #808000 |
Цветовая схема
Совет. Используйте наш выбор цвета HTML, если вам нужно выбрать из почти бесконечного множества цветов.
Код | цвет |
---|---|
#000000 | черный |
# 0C090A | Ночь |
# 2C3539 | темно-серый цвет |
# 2B1B17 | полуночный |
# 34282C | Древесный уголь |
# 25383C | Темный шифер серый |
# 3B3131 | масло |
#413839 | Черная кошка |
# 3D3C3A | Iridii |
# 463E3F | Черный угорь |
# 4C4646 | Черная корова |
# 504A4B | Серый волк |
#565051 | Сердце вампиров |
# 5C5858 | Серый дельфин |
# 625D5D | Углеродный серый |
#666362 | Ясень |
# 6D6968 | Облачно серый |
# 726E6D | Дымчатый серый |
# 736F6E | Серый |
# 837E7C | гранит |
#848482 | Броненосец Серый |
# B6B6B4 | Серый облако |
# D1D0CE | Серый гусь |
# Скорость4E2 | платиновый |
# BCC6CC | Металлический серебристый |
# 98AFC7 | Серо-голубой |
# 6D7B8D | Светлый серый шифер |
#657383 | Шифер серый |
# 616D7E | Jet Grey |
# 646D7E | Mist Blue |
# 566D7E | Мраморный синий |
# 737CA1 | Шифер Синий |
# 4863A0 | Стальной синий |
# 2B547E | Голубая сойка |
# 2B3856 | Темный шифер Синий |
# 151B54 | Темно-синий |
#000080 | Темно-синий |
# 342D7E | Синий кит |
# 15317E | Ляпис синий |
# 151B8D | Джинсовая темно-синяя |
# 0000A0 | Земля Синий |
# 0020C2 | Синий кобальт |
# 0041C2 | Голубика голубая |
# 2554C7 | Сапфирово-синий |
# 1569C7 | Голубые глаза |
# 2B60DE | Королевский синий |
# 1F45FC | Голубая орхидея |
# 6960EC | Голубой Лотос |
# 736AFF | Световой шифер синий |
# 357EC7 | Windows Blue |
# 368BC1 | Ледяной синий лед |
# 488AC7 | Синий Синий |
# 3090C7 | Голубой плющ |
# 659EC7 | Синий кои |
# 87AFC7 | Columbia Blue |
# 95B9C7 | Голубые |
# 728FCE | Легкий стальной синий |
# 2B65EC | Синий океан |
# 306EFF | Голубая лента |
# 157DEC | Голубое платье |
# 1589FF | Dodger Blue |
# 6495ED | Васильковый |
# 6698FF | Голубое небо |
# 38ACEC | Бабочка Blue |
# 56A5EC | айсберг |
# 5CB3FF | Кристально синий |
# 3BB9FF | Глубокий небесно-голубой |
# 79BAEC | Джинсовый синий |
# 82CAFA | Светло-голубой |
# 82CAFF | День Голубого |
# A0CFEC | Джинсы синие |
# B7CEEC | Голубой ангел |
# B4CFEC | Пастель Синий |
# C2DFFF | Синее море |
# C6DEFF | Порошок синий |
#AFDCEC | Коралловый синий |
#ADDFFF | Светло-синий |
#BDEDFF | Робин Яйцо Синий |
#CFECEC | Бле дно-голубая лилия |
# E0FFFF | Светлый голубой |
# EBF4FA | вода |
# F0F8FF | AliceBlue |
# F0FFFF | лазурь |
#CCFFFF | Свет овой шифер |
# 93FFE8 | Легкий аквамарин |
# 9AFEFF | Электрический синий |
# 7FFFD4 | Аквамарин |
# 00FFFF | Голубой или Аква |
# 7DFDFE | Трон Блю |
# 57FEFF | Синий циркон |
# 8EEBEC | Голубая лагуна |
# 50EBEC | небесный |
# 4EE2EC | Голубой бриллиант |
# 81D8D0 | Тиффани Блю |
# 92C7C7 | Cyan Opaque |
# 77BFC7 | Голубая Хоста |
# 78C7C7 | Северное сияние |
# 48CCCD | Средняя бирюза |
# 43C6DB | Бирюзовый |
# 46C7C7 | медуза |
# 7BCCB5 | Цвет морской волны |
# 43BFC7 | Ара синий зеленый |
# 3EA99F | Светло-зеленый |
# 3B9C9C | Темный бирюзовый |
# 438D80 | Морская черепаха зеленая |
#348781 | Средний аквамарин |
# 307D7E | Зеленый |
# 5E7D7E | Сероватый бирюзовый |
# 4C787E | Жук Зеленый |
#008080 | чирок |
# 4E8975 | Цвет морской волны |
# 78866B | Камуфляж зеленый |
# 848b79 | Зеленый шалфей |
# 617C58 | Хейзел Грин |
# 728C00 | Зеленый яд |
# 667C26 | Папоротник зеленый |
#254117 | Темный лес зеленый |
#306754 | Средний морской зеленый |
#347235 | Средний лес зеленый |
# 437C17 | Морские водоросли |
# 387C44 | Сосновый зеленый |
# 347C2C | Джунгли Грин |
# 347C17 | Shamrock Green |
#348017 | Средний весенний зеленый |
# 4E9258 | Зеленый лес |
# 6AA121 | Зеленый лук |
# 4AA02C | Весенний зеленый |
# 41A317 | Лайм Грин |
# 3EA055 | Зеленый клевер |
# 6CBB3C | Зеленая змея |
# 6CC417 | Чужой Грин |
# 4CC417 | Зеленое яблоко |
# 52D017 | Желто-зеленый |
# 4CC552 | Келли зеленый |
# 54C571 | Зомби-зеленый |
# 99C68E | Лягушка зеленый |
# 89C35C | Зеленый горошек |
# 85BB65 | Доллар Билл Грин |
# 8BB381 | Темное море |
# 9CB071 | Игуана Грин |
# B2C248 | Авокадо-зеленый |
# 9DC209 | Фисташковый зеленый |
# A1C935 | Зеленый салат |
# 7FE817 | Колибри Зеленый |
# 59E817 | Туманность Грин |
# 57E964 | Стоп-сигнал Go Green |
# 64E986 | Водоросли Зеленые |
# 5EFB6E | Нефрит зеленый |
# 00FF00 | зеленый |
# 5FFB17 | Изумрудно-зеленый |
# 87F717 | Зеленый газон |
# 8AFB17 | картезианский монастырь |
# 6AFB92 | Зеленый дракон |
# 98FF98 | мятно-зеленый |
# B5EAAA | Зеленый большой палец |
# C3FDB8 | Легкий нефрит |
# CCFB5D | Чай зеленый |
# B1FB17 | Желто-зеленый |
# BCE954 | Слизь зеленый |
# EDDA74 | Goldenrod |
# EDE275 | Урожайное золото |
# FFE87C | Солнце |
# FFFF00 | желтый |
# FFF380 | Кукуруза желтая |
# FFFFC2 | Пергамент |
#FFFFCC | Крем |
# FFF8C6 | Лимонный шифон |
# FFF8DC | Кукурузные рыльца |
# F5F5DC | Бежевый |
# FBF6D9 | Блондинка |
# FAEBD7 | AntiqueWhite |
# F7E7CE | шампанское |
#FFEBCD | BlanchedAlmond |
# F3E5AB | ваниль |
# ECE5B6 | Тан Браун |
# FFE5B4 | персик |
# FFDB58 | горчичный |
# FFD801 | Резиновый Ducky Yellow |
# FDD017 | Яркое золото |
# EAC117 | золотисто-коричневый |
# F2BB66 | Макароны с сыром |
# FBB917 | шафран |
# FBB117 | Пиво |
# FFA62F | Мускусная дыня |
# E9AB17 | Пчела Желтая |
# E2A76F | Коричневый сахар |
# DEB887 | BurlyWood |
# FFCBA4 | Глубокий персик |
# C9BE62 | Имбирь Браун |
# E8A317 | Школьный автобус желтый |
# EE9A4D | Сэнди Браун |
# C8B560 | Падение листьев |
# D4A017 | Оранжевое золото |
# C2B280 | песок |
# C7A317 | Коричневый Печенье |
# C68E17 | карамель |
# B5A642 | Латунь |
# ADA96 в | Хаки |
# C19A6B | Верблюд коричневый |
# CD7F32 | бронза |
# C88141 | Тигр Оранж |
# C58917 | корица |
# AF9B60 | Bullet Shell |
# AF7817 | Темный Goldenrod |
# B87333 | медь |
# 966F33 | Дерево |
#806517 | Дуб Браун |
#827839 | мокасин |
# 827B60 | Армия Браун |
# 786D5F | песчаник |
# 493D26 | кофе мокко |
# 483C32 | темно-серый |
# 6F4E37 | Кофе |
# 835C3B | Бурый медведь |
# 7F5217 | Красная грязь |
# 7F462C | сепия |
# C47451 | Оранжевый лосось |
# C36241 | Ржавчина |
# C35817 | Рыжая лиса |
# C85A17 | Шоколад |
# CC6600 | Sedona |
# E56717 | Папайя апельсин |
# E66C2C | Хэллоуин Оранж |
# F87217 | Тыква оранжевый |
# F87431 | Строительство Cone Orange |
# E67451 | Восход Оранжевый |
# FF8040 | Манго Оранж |
# F88017 | Темный оранжевый |
# FF7F50 | коралловый |
# F88158 | Баскетбол Оранжевый |
# F9966B | Легкий лосось |
# E78A61 | мандарин |
# E18B6B | Темный лосось |
# E77471 | Светлый коралл |
# F75D59 | Бин красный |
# E55451 | Валентин Красный |
# E55B3C | Шокирующий Оранжевый |
# FF0000 | красный |
# FF2400 | алый |
# F62217 | Рубиново-красный |
# F70D1A | Ferrari Red |
# F62817 | Пожарная машина |
# E42217 | Лава красный |
# E41B17 | Любовь Красная |
# DC381F | Грейпфрут |
# C34A2C | Честнат красный |
# C24641 | Черри красный |
# C04000 | красное дерево |
# C11B17 | Перец чили |
# 9F000F | Клюква |
#990012 | Красное вино |
# 8C001A | Бургундия |
#954535 | каштан |
# 7E3517 | Кроваво красный |
# 8A4117 | охра |
# 7E3817 | сангрия |
#800517 | огнеупорный кирпич |
#810541 | каштановый |
# 7D0541 | Сливочный пирог |
# 7E354D | Бархатный мрамор |
# 7D0552 | Слива бархат |
# 7F4E52 | Розовый Финч |
# 7F5A58 | красновато-коричневый |
# 7F525D | Тусклый фиолетовый |
# B38481 | Розовый Браун |
# C5908E | Хаки Роуз |
# C48189 | Розовый лук |
# C48793 | Губная помада Розовая |
# E8ADAA | Роза |
# ECC5C0 | Розовое золото |
# EDC9AF | Песок пустыни |
# FDD7E4 | Свинья Розовый |
#FCDFFF | Сахарная вата |
#FFDFDD | Розовая пузырьковая камедь |
# FBBBB9 | Туманная роза |
#FAAFBE | розовый |
#FAAFBA | Светло-розовый |
# F9A7B0 | Фламинго Розовый |
# E7A1B0 | Розовая роза |
# E799A3 | Розовая ромашка |
# E38AAE | Кадиллак Пинк |
# F778A1 | Гвоздика розовая |
# E56E94 | Румяна красные |
# F660AB | Ярко-розовый |
# FC6C85 | Арбуз розовый |
# F6358A | Фиолетовый Красный |
# F52887 | Темно-розовый |
# E45E9D | Розовый кекс |
# E4287C | Розовый лемонад |
# F535AA | Неоновый розовый |
# FF00FF | фуксин |
# E3319D | Dimorphotheca Magenta |
# F433FF | Яркий неоновый розовый |
# D16587 | Бледно-фиолетовый красный |
# C25A7C | Тюльпан Розовый |
# CA226B | Средний фиолетовый красный |
# C12869 | Розовый Розовый |
# C12267 | Утомленные розовые |
# C25283 | Застенчивый розовый |
# C12283 | Темная гвоздика Розовая |
# B93B8F | слива |
# 7E587E | Виола Фиолетовый |
# 571B7E | Фиолетовая радужка |
#583759 | Слива Фиолетовая |
# 4B0082 | Индиго |
# 461B7E | Фиолетовый монстр |
# 4E387E | Фиолетовый туман |
#614051 | Баклажан |
# 5E5A80 | виноград |
# 6A287E | Фиолетовый джем |
# 7D1B7E | Темная орхидея |
# A74AC7 | Фиолетовый цветок |
# B048B5 | Средняя орхидея |
# 6C2DC7 | Фиолетовый аметист |
# 842DCE | Темно-фиолетовый |
# 8D38C9 | Фиолетовый |
# 7A5DC7 | Фиолетовый мудрец Буш |
# 7F38EC | Прекрасный фиолетовый |
#8E35EF | Пурпурный |
#893BFF | Aztech Purple |
#8467D7 | Средний фиолетовый |
#A23BEC | Жасмин Фиолетовый |
#B041FF | Фиолетовый нарцисс |
#C45AEC | Тирьян Фиолетовый |
#9172EC | Крокус Фиолетовый |
#9E7BFF | Фиолетовая мимоза |
#D462FF | Гелиотроп Фиолетовый |
#E238EC | малиновый |
#C38EC7 | Фиолетовый дракон |
#C8A2C8 | Сирень |
#E6A9EC | Румяна Розовый |
#E0B0FF | розовато-лиловый |
#C6AEC7 | Вистерия Фиолетовый |
#F9B7FF | Цветущий Розовый |
#D2B9D3 | чертополох |
#E9CFEC | барвинок малый |
#EBDDE2 | Лаванда Пиноккио |
#E3E4FA | Лаванда синяя |
#FDEEF4 | жемчужный |
#FFF5EE | Морская ракушка |
#FEFCFF | Молочный белый |
#FFFFFF | белый |
Код цвета HTML для #FF0000
Цвета, которые составляют # FF0000
W3C Название цвета: Красный
RGB: 255, 0, 0 — HSL: 0,00, 1,00, 0,50
CSS Сокращение: #F00
Web Safe Цвет: Да
Модуль CSS color подробно описывает значения, которые позволяют авторам определять цвета и непрозрачность html-элементов, а также значения свойства color .
Свойство color
- Содержание:
- 1. Приоритетные цвета: свойство color
- 2. Значения цвета
- 2.1. Основные ключевые слова
- 2.2. Числовые значения цвета
- 2.2.1. Цвета модели RGB
- 2.2.2. Цвета модели RGBA
- 2.2.3. Ключевое слово transparent
- 2.2.4. HSL-цвета
- 2.2.5. HSLA-значения цвета
- 2.3. Расширенные ключевые слова цвета
- 2.4. Ключевое слово currentColor
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 в шестнадцатеричном формате — это знак # , за которым сразу следуют три или шесть шестнадцатеричных символов. Трехзначная запись RGB #rgb преобразуется в шестизначную форму #rrggbb путем копирования цифр, а не путем добавления нулей. Например, #fb0 расширяется до #ffbb00 . Это гарантирует, что белый #ffffff может быть указан в короткой записи #fff , и удаляет любые зависимости от глубины цвета дисплея.
Формат значения RGB в функциональной нотации — rgb( , за которым следует разделенный запятыми список из трех числовых значений (либо трех целочисленных значений, либо трех процентных значений), за которыми следует символ ) . Целочисленное значение 255 соответствует 100% и F или FF в шестнадцатеричной записи:
Символы пробела допускаются вокруг числовых значений.
Все цвета RGB указываются в цветовом пространстве sRGB. Пользовательские агенты могут различаться в точности, с которой они представляют эти цвета, но использование sRGB дает однозначное и объективно измеримое определение того, каким должен быть цвет.
Значения за пределами диапазона устройства должны быть обрезаны или отображены в известном диапазоне: значения красного, зеленого и синего необходимо изменить, чтобы они попадали в диапазон, поддерживаемый устройством. Некоторые устройства, например принтеры, имеют диапазоны, отличные от sRGB, поэтому некоторые цвета за пределами диапазона 0..255 sRGB будут представимы (внутри диапазона устройства) и будут отображаться.
2.2.2. Цвета модели RGBA
Цветовая модель RGB расширена в этой спецификации, чтобы включить alpha , которая управляющая непрозрачностью цвета. В отличие от значений RGB, для значения RGBA нет шестнадцатеричной записи.
Формат значения RGBA в функциональной нотации — rgba( за которым следует разделенный запятыми список из трех числовых значений (либо трех целочисленных значений, либо трех процентных значений), за которыми следует значение непрозрачности, а затем ) . Целочисленное значение 255 соответствует 100% , rgba (255,255,255,0.8) = rgba (100%,100%,100%,0.8) . Символы пробела допускаются вокруг числовых значений.
Параметр непрозрачности применяется ко всему объекту. Любые значения за пределами диапазона от 0.0 (полностью прозрачный) до 1.0 (полностью непрозрачный) будут ограничены этим диапазоном.
2.2.3. Ключевое слово transparent
Это ключевое слово можно считать сокращением для прозрачного черного цвета rgba (0,0,0,0) , которое является его вычисленным значением.
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-значения цвета
Так же, как функциональная нотация rgb() имеет альфа-аналог rgba() , функциональная нотация hsl() имеет альфа-аналог hsla() .
Формат значения цвета HSLA в функциональной нотации — 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
CSS1 и CSS2 определили начальное значение свойства border-color как значение свойства color , но не определили соответствующее ключевое слово. Это упущение было распознано SVG, поэтому SVG 1.0 ввел значение currentColor для свойств fill , stroke , stop-color , flood-color и lighting-color . CSS3 расширяет значение цвета, добавляя ключевое слово currentColor , чтобы разрешить его использование со всеми свойствами, которые принимают значение color . Это упрощает определение этих свойств в CSS3.
Используемое значение ключевого слова currentColor — это вычисленное значение свойства color . Если ключевое слово установлено в самом свойстве color , оно рассматривается как color: inherit .