Пятница , 8 Ноябрь 2024
ДомойПубликацииТаблица цветов HTML и CSS

Таблица цветов HTML и CSS

А вы знали, что CSS для раскраски HTML предлагает для использования более ста сорока цветов?

Я говорю не о тех, которые можно назначить с помощью шестнадцатеричного представления, вроде #rrggbb или аналогичный им десятеричной триаде rgb(rr, gg, bb). Это цвета, для которых выделено именованное название.

HTML таблица цветов

В общем, если есть желание, можно воспользоваться представленной ниже HTML таблицей цветов для CSS и поразить всех своей интеллектуальностью. Шутка.

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

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

  • цвета фона background-color (как в таблице ниже);
  • цвета текста color;
  • в других местах, подразумевающих ввод цвета, например, свойства border-color, box-shadow и некоторые другие.

Для использования в HTML существует атрибут style, например, следующий код раскрасит блок в красный цвет:
<div style="background-color:red;">example</div>

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

Прошу простить за возможные ошибки перевода, но не носителю языка некоторые конструкции (которые и словарям неизвестны) трудно представить на русском.

Рейтинг: 0

Автор публикации

2 070
не в сети 3 месяца

x64 (aka andi)

Комментарии: 2893Публикации: 405Регистрация: 02-04-2009
Так себеНеплохоХорошоЗамечательноСупер! (Оценок пока нет)
Загрузка...

6 комментариев

  1. Надежда Давыдова

    Очень актуальная информация! Часто в поисках нужного цвета можно провести не один час, и поиски останутся безрезультатными. Важно, что в Вашей таблице есть спокойные цвета, а не в стиле «вырвиглаз».

    Рейтинг: 1
  2. Красиво, но на практике пользы мало. Предлагаю написать статью, каким образом можно легко и непринуждённо брать цвет пипеткой с любой точки экрана, определять его десятичное или 16-тиричное представление, подбирать для выбранного цвета гармонирующие дополнительные цвета для составления палитры. Вдруг кто-то не умеет)

    Рейтинг: 1
    • Здравствуйте.
      Да согласен же, mediumspringgreen или lightgoldenrodyellow для подавляющего большинства пользователей ничуть не более понятны, чем какой-нибудь цвет воронёной стали.
      А пипеткой я пользуюсь очень редко, но когда дело доходит, то сводится всё к захвату изображения с экрана, вставки через буфер в Paint.NET и «отпипечивание» нужного цвета там.
      А вот как самостоятельно подбирать гармоничные цвета — не знаю. Только с помощью одного из соответствующих сервисов. И вроде бы в Photoshop такая возможность имеется (но у меня его нет).

      Рейтинг: 0
  3. Константин

    Раньше иногда приходилось использовать в качестве значений словесные названия цветов, но применял только основные цвета (почти все наизусть помнил), о существовании дополнительных даже не догадывался. А их вон сколько, оказывается… )

    Рейтинг: 1

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

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

Наш сайт использует файлы cookies, чтобы улучшить работу и повысить эффективность сайта. Продолжая работу с сайтом, вы соглашаетесь с использованием нами cookies и политикой конфиденциальности.

Принять