Палитра html цветов: HTML CSS Палитра цветов

140 HTML цветов с названиями, HEX и RGB кодами

В HTML с помощью специального кода можно изменить цвет текста, фона, ссылки, шрифта, таблицы или всей страницы.

Цвет в HTML

Значение для свойства color можно задать тремя основными способами:

  • по названию цвета: red, green, blue, gold, olive, magenta, cyan, brown и так далее
  • по шестнадцатеричному значению (hexadecimal number): от #000000 до #ffffff
  • по коду цвета в RGB палитре: от rgb(0, 0, 0) до rgb(255, 255, 255)

С названием цвета все относительно просто. Единственное ограничение в том, что мы должны выбирать цвет из нескольких предустановленных вариантов.

В стандартном наборе HTML 140 цветов и если тебе нужен будет какой-то цвет, который не представлен там, то нужно будет использовать шестнадцатеричный формат (HEX код) или RGB.

HEX код для цвета в HTML

HEX код всегда начинается с символа # за которым следует трехбайтовое шестнадцатеричное число (всего 6 цифр). Каждый байт отвечает за интенсивность одного из трех основных цветов: первый отвечает за интенсивность красного цвета, второй — зеленого, третий — синего:

Значение 00 — самая низкая интенсивность, FF — самая высокая. Например, для получения белого цвета нужно “смешать” три основных цвета с максимальной интенсивностью: #FFFFFF. Для получения черного цвета, соответственно, интенсивность всех цветом должна быть минимальной: #000000.

— Так это же как на уроках рисования — для получения любого цвета нужно просто смешать красный, синий и зеленый.

— Точно. Для получения красного цвета нужно байту, отвечающий за красный цвет установить максимальное значение, а для остальных — минимальное: ##FF0000.

— Тогда для зеленого HEX код будет таким: #00FF00.

RGB палитра HTML цветов

В RGB палитре цвет добавляется по такому же, принципу: задается интенсивность красного (red), зеленого (green) и синего (blue) цветов. От сюда и аббревиатура RGB. Только интенсивность указываться здесь числами 0 от 225, где 0 — самая низкая интенсивность, 225 — самая высокая. Для примера, зеленый цвет будет выглядеть следующим образом: rgb(0, 225, 0);

Все эти значения подходят и для других ситуаций, где нужен цвет, например в background-color.

Таблица из 140 HTML цветов с названиями и кодами (строка, HEX, rgb)

В этой таблице все HTML цвета у которых есть английское название и HTML код. Если ты хочешь стать FULL STACK JS разработчиком

— регистрируйся бесплатно на мой курс по веб программированию

ЦветНазваниеHTML КодHEX кодRGB код
 бордовыйmaroon#800000(128,0,0)
 темно-красныйdarkred#8B0000(139,0,0)
 коричневыйbrown#A52A2A(165,42,42)
 кирпичныйfirebrick#B22222(178,34,34)
 малиновыйcrimson#DC143C(220,20,60)
 красныйred#FF0000(255,0,0)
 томатныйtomato#FF6347(255,99,71)
 коралловыйcoral#FF7F50(255,127,80)
 индийский красный indianred#CD5C5C(205,92,92)
 светлый кораллlightcoral#F08080(240,128,128)
 темный лососьdarksalmon#E9967A(233,150,122)
 лососьsalmon#FA8072(250,128,114)
 светлый лососьlightsalmon#FFA07A(255,160,122)
 оранжево-красныйorangered#FF4500(255,69,0)
 темно-оранжевыйdarkorange#FF8C00(255,140,0)
 оранжевыйorange#FFA500(255,165,0)
 золотойgold#FFD700(255,215,0)
 темно-золотойdarkgoldenrod#B8860B(184,134,11)
 золотистый
goldenrod
#DAA520(218,165,32)
 бледно-золотойpalegoldenrod#EEE8AA(238,232,170)
 темный хакиdarkkhaki#BDB76B(189,183,107)
 хакиkhaki#F0E68C(240,230,140)
 оливковыйolive#808000(128,128,0)
 желтыйyellow#FFFF00(255,255,0)
 желто-зеленыйyellowgreen#9ACD32(154,205,50)
 темно-оливковыйdarkolivegreen#556B2F(85,107,47)
 оливково-зеленыйolivedrab#6B8E23(107,142,35)
 салатовыйlawngreen#7CFC00(124,252,0)
 шартрезchartreuse #7FFF00(127,255,0)
 зелено-желтыйgreenyellow#ADFF2F(173,255,47)
 темно-зеленыйdarkgreen#006400(0,100,0)
 зеленыйgreen#008000(0,128,0)
 зеленый лесforestgreen#228B22(34,139,34)
 лаймlime#00FF00(0,255,0)
 зеленый лаймlimegreen#32CD32(50,205,50)
 светло-зеленыйlightgreen#90EE90(144,238,144)
 бледно-зеленыйpalegreen#98FB98(152,251,152)
 темно-зеленое мореdarkseagreen#8FBC8F(143,188,143)
 средне-весенний зеленыйmediumspringgreen#00FA9A(0,250,154)
 весенний зеленыйspringgreen#00FF7F(0,255,127)
 зеленое мореseagreen#2E8B57(46,139,87)
 средний аквамаринmediumaquamarine#66CDAA(102,205,170)
 средне-зеленое мореmediumseagreen#3CB371(60,179,113)
 светло-зеленое мореlightseagreen#20B2AA(32,178,170)
 темно-серыйdarkslategray#2F4F4F(47,79,79)
 бирюзовыйteal#008080(0,128,128)
 темно-голубойdarkcyan#008B8B(0,139,139)
 водаaqua#00FFFF(0,255,255)
 голубой
cyan
#00FFFF(0,255,255)
 светло-голубойlightcyan#E0FFFF(224,255,255)
 темно-бирюзовыйdarkturquoise#00CED1(0,206,209)
 бирюзовыйturquoise#40E0D0(64,224,208)
 средне-бирюзовыйmediumturquoise#48D1CC(72,209,204)
 бледно-бирюзовыйpaleturquoise#AFEEEE(175,238,238)
 аквамаринaquamarine#7FFFD4(127,255,212)
 синий порошокpowderblue#B0E0E6(176,224,230)
 кадетский синийcadetblue#5F9EA0(95,158,160)
 стальной синийsteelblue#4682B4(70,130,180)
 васильковыйcornflowerblue#6495ED(100,149,237)
 темно-голубойdeepskyblue#00BFFF(0,191,255)
 синеватыйdodgerblue#1E90FF(30,144,255)
 светло-синийlightblue#ADD8E6(173,216,230)
 небесныйskyblue#87CEEB(135,206,235)
 светло-небесныйlightskyblue#87CEFA(135,206,250)
 полуночно-синийmidnightblue#191970(25,25,112)
 флотnavy#000080(0,0,128)
 темно-синийdarkblue#00008B(0,0,139)
 средне-синийmediumblue#0000CD(0,0,205)
 синий blue#0000FF(0,0,255)
 королевский синийroyalblue#4169E1(65,105,225)
 сине-фиолетовыйblueviolet#8A2BE2(138,43,226)
 индигоindigo#4B0082(75,0,130)
 темно-грифельный синийdarkslateblue#483D8B(72,61,139)
 грифельно-синийslateblue#6A5ACD(106,90,205)
 средне-грифельно синийmediumslateblue#7B68EE(123,104,238)
 средне-фиолетовыйmediumpurple#9370DB(147,112,219)
 темно-пурпурныйdarkmagenta#8B008B(139,0,139)
 темно-фиолетовыйdarkviolet#9400D3(148,0,211)
 темная орхидеяdarkorchid#9932CC(153,50,204)
 средняя орхидеяmediumorchid#BA55D3(186,85,211)
 фиолетовыйpurple#800080(128,0,128)
 чертополохthistle#D8BFD8(216,191,216)
 сливаplum#DDA0DD(221,160,221)
 лиловыйviolet#EE82EE(238,130,238)
 фуксияfuchsia#FF00FF(255,0,255)
 орхидеяorchid#DA70D6(218,112,214)
 средне-фиолетовый красныйmediumvioletred#C71585(199,21,133)
 бледно-фиолетовый красныйpalevioletred#DB7093(219,112,147)
 темно-розовыйdeeppink#FF1493(255,20,147)
 ярко-розовыйhotpink#FF69B4(255,105,180)
 светло-розовыйlightpink#FFB6C1(255,182,193)
 розовыйpink#FFC0CB(255,192,203)
 антично-белыйantiquewhite#FAEBD7(250,235,215)
 бежевыйbeige#F5F5DC(245,245,220)
 бисквитbisque#FFE4C4(255,228,196)
 бланшированный миндальblanchedalmond#FFEBCD(255,235,205)
 пшеничныйwheat#F5DEB3(245,222,179)
 кукурузный шелкcornsilk#FFF8DC(255,248,220)
 лимонный шифонlemonchiffon#FFFACD(255,250,205)
 светло-золотой желтыйlightgoldenrodyellow#FAFAD2(250,250,210)
 светло-желтыйlightyellow#FFFFE0(255,255,224)
 коричневое седлоsaddlebrown#8B4513(139,69,19)
 сиеннаsienna#A0522D(160,82,45)
 шоколадныйchocolate#D2691E(210,105,30)
 перуperu#CD853F(205,133,63)
 песочно-коричневыйsandybrown#F4A460(244,164,96)
 крепкое деревоburlywood#DEB887(222,184,135)
 загарtan#D2B48C(210,180,140)
 розово-коричневыйrosybrown#BC8F8F(188,143,143)
 мокасиныmoccasin#FFE4B5(255,228,181)
 белый навахоnavajowhite#FFDEAD(255,222,173)
 персиковыйpeachpuff#FFDAB9(255,218,185)
 туманная розаmistyrose#FFE4E1(255,228,225)
 лавандовыйlavenderblush#FFF0F5(255,240,245)
 бельеlinen#FAF0E6(250,240,230)
 старое кружевоoldlace#FDF5E6(253,245,230)
 папайаpapayawhip#FFEFD5(255,239,213)
 морская ракушкаseashell#FFF5EE(255,245,238)
 мятный кремmintcream#F5FFFA(245,255,250)
 серый шиферslategray#708090(112,128,144)
 светло-серый шиферlightslategray#778899(119,136,153)
 светло-стальной голубойlightsteelblue#B0C4DE(176,196,222)
 лавандовыйlavender#E6E6FA(230,230,250)
 цветочно-белыйfloralwhite#FFFAF0(255,250,240)
 синяя алисаaliceblue#F0F8FF(240,248,255)
 призрачно-белыйghostwhite#F8F8FF(248,248,255)
 медовая росаhoneydew#F0FFF0(240,255,240)
 слоновая костьivory#FFFFF0(255,255,240)
 лазурныйazure#F0FFFF(240,255,255)
 снежныйsnow#FFFAFA(255,250,250)
 черныйblack#000000(0,0,0)
 тускло-серыйdimgray#696969(105,105,105)
 серыйgray#808080(128,128,128)
 темно-серыйdarkgray#A9A9A9(169,169,169)
 серебристыйsilver#C0C0C0(192,192,192)
 светло-серыйlightgray#D3D3D3(211,211,211)
 гейнсбороgainsboro#DCDCDC(220,220,220)
 белый дымwhitesmoke#F5F5F5(245,245,245)
 белыйwhite#FFFFFF(255,255,255)

HTML цвета для подбора цветовой палитры для дизайна онлайн

#D5D7CC

#F6D5B6

#E9AE8C

#FF9376

#8DAAA6

#366775

#A2B4C0

#F7D0CB

#F4AC94

#D66D50

#F6C5DB

#EB81A7

#FBADBA

#FFCAC6

#FAF2DF

#73C5EA

#D98AE3

#7896D2

#9568A9

#FFC5C9

#D2DBE0

#EDECEA

#E2D9DA

#CCC1BF

#B6999B

#5C769D

#B3BDCC

#DADADA

#F7F0C6

#C2C4B6

#5FA873

#ABE1C7

#D6FAE0

#91C9D6

#457F8D

#7D3D4B

#A96E8E

#E0B9CB

#E2C9C4

#BBCACD

#2D435B

#FF9F7C

#BFCDCD

#EAB66A

#638181

#E7DBCB

#E1B8B2

#613942

#829971

#36374B

#959490

#CCC7C1

#609EAB

#A2CEDB

#8BA8B6

#A89ED1

#C8DADA

#E7D7CA

#E8F6AB

#D5A3CE

#F0D5DE

#E7A3C3

#789A95

#E2A343

#876A71

#BBC7B5

#3F5964

#ECA781

#8BC6B9

#DCDCE1

#8e9aaf

#cbc0d3

#efd3d7

#feeafa

#dee2ff

#f28482

#84a59d

#f5cac3

#f7ede2

#fed9b7

#293241

#ee6c4d

#e0fbfc

#98c1d9

#3d5a80

#ff99c8

#fcf6bd

#d0f4de

#a9def9

#d1b3c4

#d8e2dc

#efe9ae

#ffcad4

#f4acb7

#9d8189

#f5e4d7

#e5d1d0

#b4436c

#ff9fb2

#e3d0d8

#8e7dbe

#99c1b9

#f1e3d3

#f2d0a9

#d88c9a

#cebebe

#ddc9b4

#c17c74

#e5d1d0

#6d2e46

#264653

#2a9d8f

#e9c46a

#f4a261

#e76f51

#6d6875

#b5838d

#e5989b

#ffb4a2

#ffcdb2

#e29578

#ffddd2

#f5cac3

#83c5be

#006d77

#000000

#fca311

#355070

#adb5bd

#6c757d

#540b0e

#e56b6f

#e09f3e

#fff3b0

#335c67

#f2cc8f

#81b29a

#3d405b

#e07a5f

#f4f1de

#c6d2ed

#827081

#aea3b0

#e3d0d8

#e7e6f7

#C3E991

#DFCC74

#DAB081

#75485E

#51A3A3

#eff2c0

#5a7684

#ddc3d0

#9fffff

#16324f

#84C3BE

#996666

#FFCFAB

#808080

#FFA8AF

#D39B85

#FCDD76

#F19CBB

#08E8DE

#3b454a

#837E6A

#F4EDB4

#0D6E91

#D46451

#F8CED2

#ffadad

#caffbf

a0c4ff

#9bf6ff

#fdffb6

#BBC7B5

#3F5964

#ECA781

#8BC6B9

#DCDCE1

#B5C9D0

#FED65E

#D6E1CF

#FF7F02

#568B74

#BAC7B4

#3E5962

#ADAFB4

#709B92

#DBDCE0

#C1C3F3

#C9B8D8

#EDC4D6

#FFDCE2

#FFEAE5

#F5CEC7

#E79796

#FFB284

#FFC98B

#B4E2A6

#E2DBD5

#9CB1A5

#8AA4B3

#C8B7C9

#9E7980

#2E4E74

#99BDDD

#C7E5ED

#F3F9F9

#BBABCF

#86E3CE

#D0E6A8

#FFDD95

#FF867D

#CCABDA

#959597

#F5DF4E

#8CACD3

#B0A3CE

#F0A1C1

#5C0F19

#9F2B34

#F46173

#DB879E

#F7CBE2

#73D8CA

#6499B9

#8079A5

#DFB3CC

#DCD5DC

#D6DAD9

#7B8489

#D3B6B0

#976E76

#A79CA2

Все изображения имеют Pixabay License
Бесплатны для коммерческого использования
Указание авторства не требуется

Политика конфиденциальности

Instagram Vk Pinterest

Прокрутить вверх

140 HTML-цветов с кодами HEX, RGB и именами

С таким большим выбором цветов может быть сложно решить, какой из них использовать для вашего веб-сайта или блога. Но с небольшой помощью из этого списка из 140 цветов HTML вы сможете найти идеальный цвет для своего следующего проекта.

Используя цветовой код RGB или HEX в HTML, вы можете изменить цвет текста, фона, URL-адреса, шрифта, таблицы или всей страницы.

Цвета в HTML

Значение свойства color можно задать тремя основными способами:

  • по названию цвета, например, красный , зеленый , синий
  • по шестнадцатеричному числу: от #000000 до #ffffff
  • по коду цвета в палитре RGB: от rgb (0, 0, 0) до rgb(255, 255, 255)

Название цвета относительно простое. Единственным ограничением является то, что мы должны выбрать цвет из нескольких предопределенных вариантов.

Стандартный набор цветов HTML состоит из 140 различных значений. Если вам нужен цвет, который там не представлен, вам нужно будет использовать шестнадцатеричный формат (код HEX) или RGB.

HEX-коды цветов в HTML

HEX-код всегда начинается с # , за которым следует 3-байтовое шестнадцатеричное число (всего 6 цифр). Каждый байт отвечает за интенсивность одного из трех основных цветов: первый отвечает за интенсивность красного, второй за зеленый, а третий за синий:

Значение 00 — наименьшая интенсивность, FF самая высокая. Например, чтобы получить белый, нужно «смешать» три основных цвета с максимальной интенсивностью: #FFFFFF . Для получения черного цвета интенсивность всех цветов должна быть минимальной: #000000 .

— Так же, как и на уроках рисования — чтобы получить любой цвет, нужно просто смешать красный, синий и зеленый.

— Точно. Для получения красного цвета нужно установить максимальное значение байта, отвечающего за красный цвет, а для остальных — минимальное: ##FF0000 .

— тогда для зеленого цвета HEX-код будет: #00FF00

Палитра RGB цветов HTML

В палитре RGB цвета смешиваются аналогичным образом путем смешивания интенсивности красного, зеленого и синего цветов. Отсюда и сокращение RGB. Только интенсивность здесь задается цифрами 0 из 255, где 0 — самая низкая интенсивность, 255 — самая высокая. Например, зеленый будет выглядеть так: rgb (0, 255, 0) ;

Все эти значения подходят для других ситуаций, когда нужен цвет, например, в background-color .

Таблица из 140 цветов HTML с именами и кодами (строка, HEX, rgb)

В этой таблице вы найдете все цвета, которые имеют имя HTML и код. Если вы хотите, чтобы стал FULL STACK JS Developer , вы можете присоединиться к моему курс современной веб-разработки

Цвет Имя Код строки HTML Шестнадцатеричный код Код RGB
  темно-бордовый темно-бордовый #800000 (128,0,0)
  темно-красный темно-красный #8B0000 (139,0,0)
  коричневый коричневый #A52A2A (165,42,42)
  огнеупорный кирпич огнеупорный кирпич #B22222 (178,34,34)
  малиновый малиновый # DC143C (220,20,60)
  красный красный #FF0000 (255,0,0)
  помидор помидор #FF6347 (255,99,71)
  коралловый коралловый #FF7F50 (255,127,80)
  индийский красный индийский красный #CD5C5C (205,92,92)
  светло-коралловый светло-коралловый #F08080 (240 128 128)
  темный лосось темно-лососевый #E9967A (233 150 122)
  лосось лосось #FA8072 (250 128 114)
  светлый лосось светлый лосось #FFA07A (255 160 122)
  оранжевый красный оранжевыйкрасный #FF4500 (255,69,0)
  темно-оранжевый темно-оранжевый #FF8C00 (255,140,0)
  оранжевый оранжевый #FFA500 (255,165,0)
  золото золото #FFD700 (255,215,0)
  тёмно-золотистый стержень темно-золотистый #B8860B (184,134,11)
  золотой стержень золотарник #DAA520 (218,165,32)
  бледно-золотистый жезл бледный золотарник #EEE8AA (238 232 170)
  темный хаки темный хаки #BDB76B (189 183 107)
  хаки хаки #F0E68C (240 230 140)
  оливковое оливковое #808000 (128,128,0)
  желтый желтый #FFFF00 (255,255,0)
  желто-зеленый желто-зеленый #9ACD32 (154,205,50)
  темно-оливковый зеленый темно-оливково-зеленый № 556B2F (85,107,47)
  оливково-серый оливково-красный #6B8E23 (107,142,35)
  зеленый газон зеленый газон #7CFC00 (124 252,0)
  шартрез шартрез #7FFF00 (127 255,0)
  зеленый желтый зелено-желтый #ADFF2F (173 255,47)
  темно-зеленый темно-зеленый #006400 (0,100,0)
  зеленый зеленый #008000 (0,128,0)
  зеленый лес зеленый лес #228B22 (34 139,34)
  известь известь #00FF00 (0,255,0)
  зеленый лайм салатовый #32CD32 (50,205,50)
  светло-зеленый светло-зеленый #90EE90 (144 238 144)
  бледно-зеленый бледно-зеленый #98FB98 (152 251 152)
  темно-зеленый цвет морской волны темно-зеленый #8FBC8F (143 188 143)
  средний весенне-зеленый средний весенне-зеленый #00FA9A (0 250 154)
  весенне-зеленый весенне-зеленый #00FF7F (0 255 127)
  цвет морской волны морская зелень #2E8B57 (46 139,87)
  средний аквамарин средний аквамарин #66CDAA (102 205 170)
  средний морской зеленый средняя морская зелень #3CB371 (60 179 113)
  светло-зеленый цвет морской волны светло-зеленый #20B2AA (32 178 170)
  темно-серый сланец темно-сланцево-серый #2F4F4F (47,79,79)
  бирюзовый бирюзовый #008080 (0,128,128)
  темно-голубой темно-голубой #008B8B (0,139,139)
  цвет морской волны цвет морской волны #00FFFF (0,255,255)
  голубой голубой #00FFFF (0,255,255)
  светло-голубой светло-голубой #E0FFFF (224 255 255)
  темно-бирюзовый темно-бирюзовый #00CED1 (0,206,209)
  бирюзовый бирюзовый #40E0D0 (64 224 208)
  средний бирюзовый средний бирюзовый #48D1CC (72 209 204)
  светло-бирюзовый бледно-бирюзовый #АФЕЕЕЕ (175 238 238)
  аквамарин аквамарин #7FFFD4 (127 255 212)
  синий порошок пудрово-синий #B0E0E6 (176 224 230)
  кадетский синий синий кадет #5F9EA0 (95 158 160)
  стальной синий стальной синий № 4682B4 (70 130 180)
  васильковый васильковый #6495ED (100 149 237)
  темно-синий темно-синий #00BFFF (0 191 255)
  синий доджер Доджерблю #1E90FF (30 144 255)
  голубой голубой #ADD8E6 (173 216 230)
  голубой небесно-голубой #87CEEB (135 206 235)
  светло-голубой светло-голубой #87CEFA (135 206 250)
  темно-синий темно-синий № 1 (25,25,112)
  темно-синий темно-синий #000080 (0,0,128)
  темно-синий темно-синий #00008B (0,0,139)
  средне-синий средне-синий #0000CD (0,0,205)
  синий синий #0000FF (0,0,255)
  королевский синий королевский синий #4169E1 (65 105 225)
  сине-фиолетовый сине-фиолетовый #8A2BE2 (138,43,226)
  индиго индиго #4B0082 (75,0,130)
  темно-синий темно-синий #483D8B (72,61,139)
  синевато-серый сине-серый #6A5ACD (106,90,205)
  средний сланцево-синий сланцево-синий #7B68EE (123 104 238)
  средний фиолетовый средне-фиолетовый #9370DB (147 112 219)
  темно-пурпурный темно-пурпурный #8B008B (139,0,139)
  темно-фиолетовый темно-фиолетовый #9400D3 (148,0,211)
  темная орхидея темная орхидея #9932CC (153,50,204)
  средняя орхидея средняя орхидея #BA55D3 (186,85,211)
  фиолетовый фиолетовый #800080 (128,0,128)
  чертополох чертополох #D8BFD8 (216 191 216)
  слива слива #DDA0DD (221 160 221)
  фиолетовый фиолетовый #EE82EE (238 130 238)
  фуксия фуксия #FF00FF (255,0,255)
  орхидея орхидея #DA70D6 (218 112 214)
  средний фиолетово-красный средне-фиолетовый красный #C71585 (199,21,133)
  светло-фиолетовый красный бледно-фиолетовый красный #DB7093 (219 112 147)
  темно-розовый темно-розовый #FF1493 (255,20,147)
  ярко-розовый ярко-розовый #FF69B4 (255 105 180)
  светло-розовый светло-розовый #FFB6C1 (255 182 193)
  розовый розовый #FFC0CB (255,192,203)
  антично-белый античный белый #FAEBD7 (250 235 215)
  бежевый бежевый #F5F5DC (245 245 220)
  бисквит бисквит #FFE4C4 (255 228 196)
  бланшированный миндаль бланшированный миндаль #FFEBCD (255 235 205)
  пшеница пшеница #F5DEB3 (245 222 179)
  кукурузные рыльца кукурузный шелк #FFF8DC (255 248 220)
  лимонный шифон лимонный шифон #FFFACD (255 250 205)
  светло-желтый золотой стержень светло-золотистый родо-желтый #ФАФАД2 (250 250 210)
  светло-желтый светло-желтый #FFFFFE0 (255 255 224)
  седельно-коричневый седельно-коричневый #8B4513 (139,69,19)
  сиена сиена #A0522D (160,82,45)
  шоколад шоколад #D2691E (210,105,30)
  перу перу #CD853F (205,133,63)
  песочно-коричневый песочно-коричневый #F4A460 (244,164,96)
  крепкая древесина бурливуд #DEB887 (222 184 135)
  желтовато-коричневый желтовато-коричневый # D2B48C (210 180 140)
  розово-коричневый розово-коричневый #BC8F8F (188 143 143)
  мокасины мокасины #FFE4B5 (255 228 181)
  белый навахо навахоуайт #FFDEAD (255 222 173)
  слоеный персик персиковый слой #FFDAB9 (255 218 185)
  туманная роза туманная роза #FFE4E1 (255 228 225)
  лавандовые румяна лавандовый румянец #FFF0F5 (255 240 245)
  белье белье #FAF0E6 (250 240 230)
  старое кружево Олдлейс #FDF5E6 (253 245 230)
  венчик папайи папайя #FFEFD5 (255 239 213)
  морская ракушка морская ракушка #FFF5EE (255 245 238)
  мятный крем мятный крем #F5FFFA (245 255 250)
  серый сланец сланцево-серый № 708090 (112 128 144)
  светло-серый сланец светло-латунно-серый #778899 (119 136 153)
  светло-стальной синий светло-стальной синий # B0C4DE (176 196 222)
  лаванда лаванда #E6E6FA (230 230 250)
  цветочный белый в цветочекбелый #FFFFAF0 (255 250 240)
  Алиса Блю алисаблю #F0F8FF (240 248 255)
  призрачный белый призрачный белый #F8F8FF (248 248 255)
  медовая роса медвяная роса #F0FFF0 (240 255 240)
  слоновая кость слоновая кость #FFFFFF0 (255 255 240)
  лазурный лазурный #F0FFFF (240 255 255)
  снег снег #FFFAFA (255 250 250)
  черный черный #000000 (0,0,0)
  темно-серый темно-серый #696969 (105,105,105)
  серый серый #808080 (128 128 128)
  темно-серый / темно-серый темно-серый #A9A9A9 (169 169 169)
  серебро серебро #C0C0C0 (192 192 192)
  светло-серый / светло-серый светло-серый #D3D3D3 (211 211 211)
  Гейнсборо Гейнсборо #DCDCDC (220 220 220)
  белый дым белый дым #F5F5F5 (245 245 245)
  белый белый #FFFFFF (255 255 255)

Подробнее учебники по HTML или Изучите Full-Stack JS с нуля!

Цветовая палитра

Цветовая палитра DHS является единственной утвержденной цветовой системой, используемой для DHS и ее компонентов. Изменение этих цветов строго запрещено. Последовательное использование цветовой палитры DHS помогает обеспечить единообразие и высокую узнаваемость бренда. Эти цвета были тщательно протестированы в Интернете и в печатных СМИ на соответствие цветопередаче. Цветовая палитра DHS также соответствует цветовой системе, используемой системой веб-дизайна США.

Первичные и вторичные цвета

Основные цвета DHS необходимы для использования в ключевых элементах дизайна (таких как заголовки, функции и т. д.). Вторичные цвета следует использовать с осторожностью, они должны дополнять основные цвета или привлекать внимание к определенным областям контента.

  ​ ​ ​ ​Основные цвета ​ ​ Дополнительные цвета
  dhs-синий
HTML: #005288
RGB: 0 | 82 | 136
CMYK: 100 | 45 | 0 | 37
dhs-grey
HTML: #c0c2c4
RGB: 192 | 194 | 196
CMYK: 0 | 0 | 0 | 28
dhs-темно-серый
HTML: #5a5b5d
RGB: 90 | 91 | 93
CMYK: 0 | 0 | 0 | 79
dhs-red
HTML: #c41230
RGB: 196 | 18 | 48
CMYK: 0 | 100 | 79 | 20
dhs-светло-синий
HTML: #0078ae
RGB: 0 | 120 | 174
CMYK: 100 | 16 | 0 | 27
dhs-зеленый
HTML: #5e9732
RGB: 94 | 151 | 50
CMYK: 56 | 0 | 100 | 27​

Градиент цветов (цветовой круг)

Градиентные цвета могут использоваться в качестве фоновых цветов и для создания графических элементов, иллюстраций и т. д. Дополнительно:​​

  • Все цвета должны использоваться правильно, чтобы обеспечить высокую контрастность в соответствии с разделом 508 специальных возможностей.
  • Все цвета HTML/RGB используются для веб-, видео, мобильной и настольной печати.
  • Все цвета CMYK используются для офсетной печати.

ПРИМЕЧАНИЕ. Основные и дополнительные цвета DHS также указаны ниже и отмечены звездочкой. Они соответствуют значению «50» на цветовом круге USWDS.

Посмотреть цветовую палитру DHS в: Формат PDF | Формат Excel

  черный
HTML: #000000
RGB: 0 | 0 | 0
CMYK: ​0 | 0 | 0 | 100
  dhs-blue-90
HTML: #000305

RGB: 0 | 3 | 5
CMYK: 100 | 40 | 0 | 98

dhs-grey-90
HTML: #080808
RGB: 8 | 8 | 8
CMYK: 0 | 0 | 0 | 97
dhs-темно-серый-90
HTML: #040404
RGB: 4 | 4 | 4
CMYK: 0 | 0 | 0 | 98
dhs-red-90
HTML: #080102
RGB: 8 | 1 | 2
CMYK: 0 | 88 | 75 | 97
dhs-light-blue-90
HTML: #000507
RGB: 0 | 5 | 7
CMYK: 100 | 29 | 0 | 97
dhs-green-90
HTML: #040602
RGB: 4 | 6 | 2
CMYK: 33 | 0 | 67 | 98
  dhs-blue-80
HTML: #001726
RGB: 0 | 23 | 38
CMYK: 100 | 39 | 0 | 85
dhs-grey-80
HTML: #363637
RGB: 54 | 54 | 55
CMYK: 2 | 2 | 0 | 78
dhs-темно-серый-80
HTML: #19191a
RGB: 25 | 25 | 26
CMYK: 73 | 67 | 64 | 78
dhs-red-80
HTML: #37050d
RGB: 55 | 5 | 13
CMYK: 0 | 91 | 76 | 78
dhs-light-blue-80
HTML: #002231
RGB: 0 | 34 | 49
CMYK: 100 | 31 | 0 | 81
dhs-green-80
HTML: #1a2a0e
RGB: 26 | 42 | 14
CMYK: 38 | 0 | 67 | 84
  dhs-blue-70
HTML: #002b47
RGB: 0 | 43 | 71
CMYK: 100 | 39 | 0 | 72
dhs-серый-70
HTML: #646566
RGB: 100 | 101 | 102
CMYK: 2 | 1 | 0 | 60
dhs-темно-серый-70
HTML: #2f2f30
RGB: 47 | 47 | 48
CMYK: 70 | 64 | 62 | 61
dhs-red-70
HTML: #660919
RGB: 102 | 9 | 25
CMYK: 34 | 99 | 82 | 51
dhs-light-blue-70
HTML: #003e5a
RGB: 0 | 62 | 90
CMYK: 100 | 31 | 0 | 65
dhs-green-70
HTML: #314f1a
RGB: 49 | 79 | 26
CMYK: 76 | 44 | 100 | 44
  dhs-blue-60
HTML: #003e67
RGB: 0 | 62 | 103
CMYK: 100 | 40 | 0 | 60
dhs-grey-60
HTML: #929395
RGB: 146 | 147 | 149
CMYK: 2 | 1 | 0 | 42
dhs-темно-серый-60
HTML: #444547
RGB: 68 | 69 | 71
CMYK: 68 | 60 | 57 | 42
dhs-red-60
HTML: #950e24
RGB: 149 | 14 | 36
CMYK: 26 | 100 | 91 | 26
dhs-light-blue-60
HTML: #005b84
RGB: 0 | 91 | 132
CMYK: 100 | 31 | 0 | 48
dhs-green-60
HTML: #477326
RGB: 71 | 115 | 38
CMYK: 74 | 33 | 100 | 21

dhs-синий
HTML: #005288
RGB: 0 | 82 | 136
CMYK: 100 | 45 | 0 | 37
dhs-grey
HTML: #c0c2c4
RGB: 192 | 194 | 196
CMYK: 0 | 0 | 0 | 28
dhs-темно-серый
HTML: #5a5b5d
RGB: 90 | 91 | 93
CMYK: 0 | 0 | 0 | 79
dhs-красный
HTML: #c41230
RGB: 196 | 18 | 48
CMYK: 0 | 100 | 79 | 20
dhs-светло-синий
HTML: #0078ae
RGB: 0 | 120 | 174
CMYK: 100 | 16 | 0 | 27
dhs-зеленый
HTML: #5e9732
RGB: 94 | 151 | 50
CMYK: 56 | 0 | 100 | 27
  dhs-blue-40
HTML: #3d7ca5
RGB: 61 | 124 | 165
CMYK: 79 | 44 | 19 | 1
dhs-gray-40
HTML: #cfd1d2
RGB: 207 | 209 | 210
CMYK: 18 | 13 | 13 | 0
dhs-темно-серый-40
HTML: #828284
RGB: 130 | 130 | 132
CMYK: 51 | 43 | 41 | 6
dhs-red-40
HTML: #d24b62
RGB: 210 | 75 | 98
CMYK: 14 | 85 | 51 | 1
dhs-светло-голубой-40
HTML: #3d98c1
RGB: 61 | 152 | 193
CMYK: 73 | 27 | 12 | 0
dhs-green-40
HTML: #85b063
RGB: 133 | 176 | 99
CMYK: 53 | 13 | 79 | 1
  dhs-blue-30
HTML: #7aa5c1
RGB: 122 | 165 | 193
CMYK: 54 | 25 | 15 | 0
dhs-gray-30
HTML: #dedfe0
RGB: 222 | 223 | 224
CMYK: 12 | 8 | 8 | 0
dhs-dark-gray-30
HTML: #a9aaab
RGB: 169 | 170 | 171
CMYK: 35 | 28 | 28 | 0
dhs-red-30
HTML: #e08493
RGB: 224 | 132 | 147
CMYK: 9 | 59 | 27 | 0
dhs-light-blue-30
HTML: #7ab9d5
RGB: 122 | 185 | 213
CMYK: 50 | 13 | 9 | 0
dhs-зеленый-30
HTML: #abc994
RGB: 171 | 201 | 148
CMYK: 36 | 7 | 52 | 0
  dhs-blue-20
HTML: #b8cfde
RGB: 184 | 207 | 222
CMYK: 27 | 10 | 7 | 0
dhs-gray-20
HTML: #edeeee
RGB: 237 | 238 | 238
CMYK: 0 | 0 | 0 | 7
dhs-темно-серый-20
HTML: #d1d1d2
RGB: 209 | 209| 210
CMYK: 0 | 0 | 0 | 18
dhs-red-20
HTML: #eebdc5
RGB: 238 | 189 | 197
CMYK: 4 | 30 | 11 | 0
dhs-light-blue-20
HTML: #b8d9e8
RGB: 184 | 217 | 232
CMYK: 26 | 5 | 5 | 0
dhs-green-20
HTML: #d2e2c6
RGB: 210 | 226 | 198
CMYK: 18 | 3 | 25 | 0
  dhs-blue-15
HTML: #d6e3ec
RGB: 214 | 227 | 236
CMYK: 15 | 5 | 4 | 0
dhs-gray-15
HTML: #f5f5f6
RGB: 245 | 245 | 246
CMYK: 0 | 0 | 0 | 4
dhs-dark-gray-15
HTML: #e5e5e5
RGB: 229 | 229 | 229
CMYK: 0 | 0 | 0 | 10
dhs-red-15
HTML: #f6d9de
RGB: 246 | 217 | 222
CMYK: 2 | 16 | 5 | 0
dhs-light-blue-15
HTML: #d6e9f2
RGB: 214 | 233 | 242
CMYK: 15 | 2 | 2 | 0
dhs-green-15
HTML: #e5eede
RGB: 229 | 238 | 222
CMYK: 10 | 1 | 14 | 0
  dhs-blue-10
HTML: #f5f8fa​
RGB: 245 | 248 | 250
CMYK: 3 | 1 | 1 | 0
dhs-gray-10
HTML: #fcfdfd
RGB: 252 | 253 | 253
CMYK: 0 | 0 | 0 | 1
dhs-dark-gray-10
HTML: #f8f8f9
RGB: 248 | 248 | 249
CMYK: 0 | 0 | 0 | 2
dhs-red-10
HTML: #fdf6f7
RGB: 253 | 246 | 247
CMYK: 0 | 3 | 1 | 0
dhs-light-blue-10
HTML: #f5fafc
RGB: 245 | 250 | 252
CMYK: 3 | 0 | 0 | 0
dhs-green-10
HTML: #f9fbf7
RGB: 249 | 251 | 247
CMYK: 2 | 0 | 2 | 0​
  белый
HTML: #ffffff​​
RGB: 255 | 255 | 255
CMYK: 0 | 0 | 0 | 0

Пример

На изображении ниже представлены ключевые и второстепенные элементы дизайна, демонстрирующие правильное использование цветового круга DHS.

#​ Элемент дизайна Элемент дизайна ​Тип ​Требуется основной цвет   Цвет б/у
​1 Внешнее кольцо, текст, внутренний элемент Ключ Да dhs-синий
​2 Фон кольца Среднее dhs-синий-15
​3 Зеленая фигурка Ключ Да ​dhs-зеленый
​4 Акцент на зеленой фигуре Среднее ​dhs-зеленый-30
​5 Красная фигура Ключ Да dhs-красный
​6 Акцент на красной фигуре Среднее ​dhs-red-30
​7 Синяя фигурка Ключ Да ​dhs-голубой
​8 ​Синяя фигура с акцентом Среднее ​dhs-светло-синий-30

Государственные цвета США

Кроме того, это официальные цвета правительства США — Old Glory Blue и Old Glory Red.

  Old Glory Blue
HTML: #002868
RGB: 0 | 40 | 104
CMYK: 100 | 92 | 32 | 23
Красная старая слава
HTML: #bf0a30
RGB: 191 | 10 | 48
CMYK: 17 | 100 | 86 | 7

Доступность

При использовании цветовой палитры DHS дизайнер несет ответственность за обеспечение того, чтобы подготовленные материалы соответствовали критериям DHS для соответствия Разделу 508 Доступность, особенно с точки зрения зависимости от цвета и цветового контраста.

Требование (8 цветов): Цвет не должен быть единственным средством передачи информации, указания действия, подсказки ответа или указания статуса. Информация, передаваемая с помощью цвета, также должна быть предоставлена ​​в виде текста, отображаемого на экране, или посредством визуальной дифференциации.

Оставить комментарий

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *