Коды цвета в css: Коды цветов html css палитра

Содержание

Коды цвета в css — Seoblog

От автора: всем привет. Сегодня я бы хотел поговорить о цвете в веб-разработке, а именно о том, как формируются коды цветов в html и css. Ну и вообще о способах задания цвета.

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

Задание цвета с помощью ключевых слов

Например, color: red. И даже те из вас, кто спал в школе на уроках английского, понимают, что мы задали красный цвет. Но таких вот ключевых слов в html не сильно много, чуть более сотни. То есть с их помощью вы не сможете задать миллион разных оттенков, да и запомнить все названия очень трудно. Я могу лишь порекомендовать держать в уме самые основные значения, остальное лучше задавать не с помощью ключевых слов, а по-другому.

С помощью шестнадцатеричного кода

Звучит, может быть, страшно, но на деле ничего сложного. Цвет в таком формате записывается через решетку, далее записывается 3 или 6 символов, которые и определяют оттенок. Чтобы брать значения, я рекомендую вам использовать сайт https://color.hailpixel.com

А также палитру программы Adobe Photoshop, где также отображается шестнадцатеричный код или как его еще называют – hex-код.

В фотошопе вы можете в палитре установить галочку “Только web-цвета”. В этом случае в палитре вам будут предложены только так называемые безопасные цвета, которые поддерживаются всеми браузерами. Но я вам могу сказать, что необходимость в этом потихоньку отходит в прошлое, так как современные браузеры могут без проблем распознавать миллионы оттенков.

В форматах rgb и rgba

Эти способы используются уже реже, потому что обычно хватает варианта с hex-кодом. Объяснить суть записи цвета в формате rgb очень просто. Есть красный, зеленый и синий цвета. Они являются основными. Вот на основании их смешивания мы и получаем нужный нам цвет. Для этого нужно в скобках указать первым значение насыщенности красным цветом от 0 до 255, далее через запятую проделать то же самое с зеленым и синим. Например, так:

Как вы понимаете, это позволяет задавать миллионы разных оттенков, которые будут отличаться совсем незначительно. Значение (0, 0, 0) приравнивается к черному цвету, а (255, 255, 255) – белому. Здесь действует правило, что если смешать все цвета в их максимальной насыщенности, то получится белый цвет.

Формат rgba отличается лишь тем, что добавляется четвертое значение – альфа канал. Допустимо использовать значения от 0 до 1, значения с десятичной дробью, естественно, допускаются. Это позволяет задать полупрозрачный цвет. Например, если написать так:

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

В форматах hsl и hsla

Это последние форматы, которые мы рассмотрим. В веб-разработке они используются еще реже. Расшифровывается hsl так: цвет, насыщенность, светлота. Первое значение задается числом от 0 до 360, а второе и третье в процентах.

Более понятно это объяснение будет для тех, кто работал с цветом более глубоко. В любом случае, чтобы понимать, как в этом формате формируется цвет, необходимо понимать принцип цветового круга, потому что именно на его основании задается цвет.

Собственно, hsla добавляет только тот самый альфа-канал. То есть это еще один формат, в котором вы можете получить полупрозрачный цвет. Кому-то удобнее будет использовать rgb, кому-то hsl.

Остальные форматы записи цвета мы рассматривать не будем, потому что этих с головой хватает в веб-разработке.

webformyself.com

В html формате

Очень часто требуется поменять цвет текста на сайте, мало кто из начинающих к этому прибегает, так как для этого нужно знать html и css. Но, если вы знаете эти основы web-строительства, то вы без труда с этой задачей справитесь и в помощь ниже вам будет дана таблица. Обычно начинающие меняют цвет текста маленькими абзацами, например, через встроенные редакторы статей. Но, у меня, к примеру, часто возникает задача поменять цвет текста на всем сайте и, поэтому коды цветов в html формате — для меня необходимы — «как воздух».

Меняем цвет текста на сайте

1) html код необходимого вам цвета вставляем в специальный файл css, обычно он называется style.css — вот такие примерно строки появятся в нем:

color:#FFF;

Это был пример: мы вставили корректировку, а именно назначили цвет текста белым: color:#FFF — это и есть код белого цвета в html. Не пугайтесь #FFF — это сокращенная форма, это тоже самое, что и #FFFFFF. Для экономии времени часто пользуются сокращенным кодом белого цвета в html.

Примерно может выглядеть так изменение цвета текста тела сайта — тег body:

body {color:#FFF;}

На закрытых движках типа ucoz — это делается по-другому, хотя там этот css-файл выведен отдельной ссылкой(об этом напишу позже).

2) Если вам нужно поменять цвет текста в отдельном абзаце, то встраивается такая конструкция (но она не приветствуется профессионалами, но на это мало кто смотрит и не смотрят поисковики типа Яндекса и Google, Mail, Rambler — то есть основным ПС это безразлично, потому что это «не ошибка»)

А вставляется такая конструкция:

style="color:#FFF;"

То есть применительно к абзацу, а это тег p, конструкция будет иметь следующий вид:

<p>

В общем ничего сложного! Только смотрите внимательно, белый цвет тут был приведен для примера, если вы назначите белый цвет для белого фона, то текста вы, конечно же, не увидите.

3) Если вам нужно изменить цвет ссылки html — конструкция приобретает следующий вид:

<a href="http://saitsozdanie.ru/">тут текст ссылки</a>

Если вы еще не знаете, что такое тег a — то мы уже об этом писали тут — «как вставить ссылку на сайт». Вообще изменение цвета ссылки через html код страницы редко делают, во-первых это муторно, а во-вторых также считается, если не дурным тоном, то что-то типа того.

Таблица цветов html

Ниже приведена таблица цветов html, только также не забывайте вставить знак решетки перед кодом:

Сервис от Яндекса

Яндекс также предоставляет онлайн-сервис по html-цветам, иногда тоже помогает, но им все же реже пользуюсь. Вот можете потыкать и html цвета онлайн яндекс.

Упрощенная форма html цвет на английском

Если вы знаете хоть немного знаете английский язык то вам еще проще будет освоить упрощенную форму записи популярных цветов в html на английском. К, примеру: brown — коричневый, green — зеленый, blue — синий, red — красный, white — белый, grey — серый, black — черный и тд. Вот как это будет выглядеть:

<p>

То есть, все то же самое, просто заменяем код на слова.

Пока на этом все, я надеюсь вам была полезна статья, следите за новостями http://saitsozdanie.ru.

Я тоже когда-то начинал с азов, а вот как я начинал свое обучение основам html.

saitsozdanie.ru

Перечисление цветов Color, а также функции ColorFade, ColorValue и RGBA в Power Apps — Power Platform

Color.AliceBlue	ColorValue( «#f0f8ff» ) ColorValue( «aliceblue» )	RGBA( 240, 248, 255, 1 )
Color.AntiqueWhite	ColorValue( «#faebd7» ) ColorValue( «AntiqueWhite» )	RGBA( 250, 235, 215, 1 )
Color. Aqua	ColorValue( «#00ffff» ) ColorValue( «AQUA» )	RGBA( 0, 255, 255, 1 )
Color.Aquamarine	ColorValue( «#7fffd4» ) ColorValue( «Aquamarine» )	RGBA( 127, 255, 212, 1 )
Color.Azure	ColorValue( «#f0ffff» ) ColorValue( «azure» )	RGBA( 240, 255, 255, 1 )
Color.Beige	ColorValue( «#f5f5dc» ) ColorValue( «Beige» )	RGBA( 245, 245, 220, 1 )
Color.Bisque	ColorValue( «#ffe4c4» ) ColorValue( «BISQUE» )	RGBA( 255, 228, 196, 1 )
Color. Black	ColorValue( «#000000» ) ColorValue( «Black» )	RGBA( 0, 0, 0, 1 )
Color.BlanchedAlmond	ColorValue( «#ffebcd» ) ColorValue( «blanchedalmond» )	RGBA( 255, 235, 205, 1 )
Color.Blue	ColorValue( «#0000ff» ) ColorValue( «Blue» )	RGBA( 0, 0, 255, 1 )
Color.BlueViolet	ColorValue( «#8a2be2» ) ColorValue( «BLUEVIOLET» )	RGBA( 138, 43, 226, 1 )
Color.Brown	ColorValue( «#a52a2a» ) ColorValue( «Brown» )	RGBA( 165, 42, 42, 1 )
Color. Burlywood	ColorValue( «#deb887» ) ColorValue( «burlywood» )	RGBA( 222, 184, 135, 1 )
Color.CadetBlue	ColorValue( «#5f9ea0» ) ColorValue( «CadetBlue» )	RGBA( 95, 158, 160, 1 )
Color.Chartreuse	ColorValue( «#7fff00» ) ColorValue( «CHARTREUSE» )	RGBA( 127, 255, 0, 1 )
Color.Chocolate	ColorValue( «#d2691e» ) ColorValue( «Chocolate» )	RGBA( 210, 105, 30, 1 )
Color.Coral	ColorValue( «#ff7f50» ) ColorValue( «coral» )	RGBA( 255, 127, 80, 1 )
Color. CornflowerBlue	ColorValue( «#6495ed» ) ColorValue( «CornflowerBlue» )	RGBA( 100, 149, 237, 1 )
Color.Cornsilk	ColorValue( «#fff8dc» ) ColorValue( «CORNSILK» )	RGBA( 255, 248, 220, 1 )
Color.Crimson	ColorValue( «#dc143c» ) ColorValue( «Crimson» )	RGBA( 220, 20, 60, 1 )
Color.Cyan	ColorValue( «#00ffff» ) ColorValue( «cyan» )	RGBA( 0, 255, 255, 1 )
Color.DarkBlue	ColorValue( «#00008b» ) ColorValue( «DarkBlue» )	RGBA( 0, 0, 139, 1 )
Color. DarkCyan	ColorValue( «#008b8b» ) ColorValue( «DARKCYAN» )	RGBA( 0, 139, 139, 1 )
Color.DarkGoldenRod	ColorValue( «#b8860b» ) ColorValue( «DarkGoldenRod» )	RGBA( 184, 134, 11, 1 )
Color.DarkGray	ColorValue( «#a9a9a9» ) ColorValue( «darkgray» )	RGBA( 169, 169, 169, 1 )
Color.DarkGreen	ColorValue( «#006400» ) ColorValue( «DarkGreen» )	RGBA( 0, 100, 0, 1 )
Color.DarkGrey	ColorValue( «#a9a9a9» ) ColorValue( «DARKGREY» )	RGBA( 169, 169, 169, 1 )
Color. DarkKhaki	ColorValue( «#bdb76b» ) ColorValue( «DarkKhaki» )	RGBA( 189, 183, 107, 1 )
Color.DarkMagenta	ColorValue( «#8b008b» ) ColorValue( «darkmagenta» )	RGBA( 139, 0, 139, 1 )
Color.DarkOliveGreen	ColorValue( «#556b2f» ) ColorValue( «DarkOliveGreen» )	RGBA( 85, 107, 47, 1 )
Color.DarkOrange	ColorValue( «#ff8c00» ) ColorValue( «DARKORANGE» )	RGBA( 255, 140, 0, 1 )
Color.DarkOrchid	ColorValue( «#9932cc» ) ColorValue( «DarkOrchid» )	RGBA( 153, 50, 204, 1 )
Color. DarkRed	ColorValue( «#8b0000» ) ColorValue( «darkred» )	RGBA( 139, 0, 0, 1 )
Color.DarkSalmon	ColorValue( «#e9967a» ) ColorValue( «DarkSalmon» )	RGBA( 233, 150, 122, 1 )
Color.DarkSeaGreen	ColorValue( «#8fbc8f» ) ColorValue( «DARKSEAGREEN» )	RGBA( 143, 188, 143, 1 )
Color.DarkSlateBlue	ColorValue( «#483d8b» ) ColorValue( «DarkSlateBlue» )	RGBA( 72, 61, 139, 1 )
Color.DarkSlateGray	ColorValue( «#2f4f4f» ) ColorValue( «darkslategray» )	RGBA( 47, 79, 79, 1 )
Color. DarkSlateGrey	ColorValue( «#2f4f4f» ) ColorValue( «DarkSlateGrey» )	RGBA( 47, 79, 79, 1 )
Color.DarkTurquoise	ColorValue( «#00ced1» ) ColorValue( «DARKTURQUOISE» )	RGBA( 0, 206, 209, 1 )
Color.DarkViolet	ColorValue( «#9400d3» ) ColorValue( «DarkViolet» )	RGBA( 148, 0, 211, 1 )
Color.DeepPink	ColorValue( «#ff1493» ) ColorValue( «deeppink» )	RGBA( 255, 20, 147, 1 )
Color.DeepSkyBlue	ColorValue( «#00bfff» ) ColorValue( «DeepSkyBlue» )	RGBA( 0, 191, 255, 1 )
Color. DimGray	ColorValue( «#696969» ) ColorValue( «DIMGRAY» )	RGBA( 105, 105, 105, 1 )
Color.DimGrey	ColorValue( «#696969» ) ColorValue( «DimGrey» )	RGBA( 105, 105, 105, 1 )
Color.DodgerBlue	ColorValue( «#1e90ff» ) ColorValue( «dodgerblue» )	RGBA( 30, 144, 255, 1 )
Color.FireBrick	ColorValue( «#b22222» ) ColorValue( «FireBrick» )	RGBA( 178, 34, 34, 1 )
Color.FloralWhite	ColorValue( «#fffaf0» ) ColorValue( «FLORALWHITE» )	RGBA( 255, 250, 240, 1 )
Color. ForestGreen	ColorValue( «#228b22» ) ColorValue( «ForestGreen» )	RGBA( 34, 139, 34, 1 )
Color.Fuchsia	ColorValue( «#ff00ff» ) ColorValue( «fuchsia» )	RGBA( 255, 0, 255, 1 )
Color.Gainsboro	ColorValue( «#dcdcdc» ) ColorValue( «Gainsboro» )	RGBA( 220, 220, 220, 1 )
Color.GhostWhite	ColorValue( «#f8f8ff» ) ColorValue( «GHOSTWHITE» )	RGBA( 248, 248, 255, 1 )
Color.Gold	ColorValue( «#ffd700» ) ColorValue( «Gold» )	RGBA( 255, 215, 0, 1 )
Color. GoldenRod	ColorValue( «#daa520» ) ColorValue( «goldenrod» )	RGBA( 218, 165, 32, 1 )
Color.Gray	ColorValue( «#808080» ) ColorValue( «Gray» )	RGBA( 128, 128, 128, 1 )
Color.Green	ColorValue( «#008000» ) ColorValue( «GREEN» )	RGBA( 0, 128, 0, 1 )
Color.GreenYellow	ColorValue( «#adff2f» ) ColorValue( «GreenYellow» )	RGBA( 173, 255, 47, 1 )
Color.Grey	ColorValue( «#808080» ) ColorValue( «grey» )	RGBA( 128, 128, 128, 1 )
Color. Honeydew	ColorValue( «#f0fff0» ) ColorValue( «Honeydew» )	RGBA( 240, 255, 240, 1 )
Color.HotPink	ColorValue( «#ff69b4» ) ColorValue( «HOTPINK» )	RGBA( 255, 105, 180, 1 )
Color.IndianRed	ColorValue( «#cd5c5c» ) ColorValue( «IndianRed» )	RGBA( 205, 92, 92, 1 )
Color.Indigo	ColorValue( «#4b0082» ) ColorValue( «indigo» )	RGBA( 75, 0, 130, 1 )
Color.Ivory	ColorValue( «#fffff0» ) ColorValue( «Ivory» )	RGBA( 255, 255, 240, 1 )
Color. Khaki	ColorValue( «#f0e68c» ) ColorValue( «KHAKI» )	RGBA( 240, 230, 140, 1 )
Color.Lavender	ColorValue( «#e6e6fa» ) ColorValue( «Lavender» )	RGBA( 230, 230, 250, 1 )
Color.LavenderBlush	ColorValue( «#fff0f5» ) ColorValue( «lavenderblush» )	RGBA( 255, 240, 245, 1 )
Color.LawnGreen	ColorValue( «#7cfc00» ) ColorValue( «LawnGreen» )	RGBA( 124, 252, 0, 1 )
Color.LemonChiffon	ColorValue( «#fffacd» ) ColorValue( «LEMONCHIFFON» )	RGBA( 255, 250, 205, 1 )
Color. LightBlue	ColorValue( «#add8e6» ) ColorValue( «LightBlue» )	RGBA( 173, 216, 230, 1 )
Color.LightCoral	ColorValue( «#f08080» ) ColorValue( «lightcoral» )	RGBA( 240, 128, 128, 1 )
Color.LightCyan	ColorValue( «#e0ffff» ) ColorValue( «LightCyan» )	RGBA( 224, 255, 255, 1 )
Color.LightGoldenRodYellow	ColorValue( «#fafad2» ) ColorValue( «lightgoldenrodyellow» )	RGBA( 250, 250, 210, 1 )
Color.LightGray	ColorValue( «#d3d3d3» ) ColorValue( «LightGray» )	RGBA( 211, 211, 211, 1 )
Color. LightGreen	ColorValue( «#90ee90» ) ColorValue( «lightgreen» )	RGBA( 144, 238, 144, 1 )
Color.LightGrey	ColorValue( «#d3d3d3» ) ColorValue( «LightGrey» )	RGBA( 211, 211, 211, 1 )
Color.LightPink	ColorValue( «#ffb6c1» ) ColorValue( «LIGHTPINK» )	RGBA( 255, 182, 193, 1 )
Color.LightSalmon	ColorValue( «#ffa07a» ) ColorValue( «LightSalmon» )	RGBA( 255, 160, 122, 1 )
Color.LightSeaGreen	ColorValue( «#20b2aa» ) ColorValue( «lightseagreen» )	RGBA( 32, 178, 170, 1 )
Color. LightSkyBlue	ColorValue( «#87cefa» ) ColorValue( «LightSkyBlue» )	RGBA( 135, 206, 250, 1 )
Color.LightSlateGray	ColorValue( «#778899» ) ColorValue( «LIGHTSLATEGRAY» )	RGBA( 119, 136, 153, 1 )
Color.LightSlateGrey	ColorValue( «#778899» ) ColorValue( «LightSlateGrey» )	RGBA( 119, 136, 153, 1 )
Color.LightSteelBlue	ColorValue( «#b0c4de» ) ColorValue( «lightsteelblue» )	RGBA( 176, 196, 222, 1 )
Color.LightYellow	ColorValue( «#ffffe0» ) ColorValue( «LightYellow» )	RGBA( 255, 255, 224, 1 )
Color. Lime	ColorValue( «#00ff00» ) ColorValue( «LIME» )	RGBA( 0, 255, 0, 1 )
Color.LimeGreen	ColorValue( «#32cd32» ) ColorValue( «LimeGreen» )	RGBA( 50, 205, 50, 1 )
Color.Linen	ColorValue( «#faf0e6» ) ColorValue( «linen» )	RGBA( 250, 240, 230, 1 )
Color.Magenta	ColorValue( «#ff00ff» ) ColorValue( «Magenta» )	RGBA( 255, 0, 255, 1 )
Color.Maroon	ColorValue( «#800000» ) ColorValue( «MAROON» )	RGBA( 128, 0, 0, 1 )
Color. MediumAquamarine	ColorValue( «#66cdaa» ) ColorValue( «MediumAquamarine» )	RGBA( 102, 205, 170, 1 )
Color.MediumBlue	ColorValue( «#0000cd» ) ColorValue( «mediumblue» )	RGBA( 0, 0, 205, 1 )
Color.MediumOrchid	ColorValue( «#ba55d3» ) ColorValue( «MediumOrchid» )	RGBA( 186, 85, 211, 1 )
Color.MediumPurple	ColorValue( «#9370db» ) ColorValue( «MEDIUMPURPLE» )	RGBA( 147, 112, 219, 1 )
Color.MediumSeaGreen	ColorValue( «#3cb371» ) ColorValue( «MediumSeaGreen» )	RGBA( 60, 179, 113, 1 )
Color. MediumSlateBlue	ColorValue( «#7b68ee» ) ColorValue( «mediumslateblue» )	RGBA( 123, 104, 238, 1 )
Color.MediumSpringGreen	ColorValue( «#00fa9a» ) ColorValue( «MediumSpringGreen» )	RGBA( 0, 250, 154, 1 )
Color.MediumTurquoise	ColorValue( «#48d1cc» ) ColorValue( «MEDIUMTURQUOISE» )	RGBA( 72, 209, 204, 1 )
Color.MediumVioletRed	ColorValue( «#c71585» ) ColorValue( «MediumVioletRed» )	RGBA( 199, 21, 133, 1 )
Color.MidnightBlue	ColorValue( «#191970» ) ColorValue( «midnightblue» )	RGBA( 25, 25, 112, 1 )
Color. MintCream	ColorValue( «#f5fffa» ) ColorValue( «MintCream» )	RGBA( 245, 255, 250, 1 )
Color.MistyRose	ColorValue( «#ffe4e1» ) ColorValue( «MISTYROSE» )	RGBA( 255, 228, 225, 1 )
Color.Moccasin	ColorValue( «#ffe4b5» ) ColorValue( «Moccasin» )	RGBA( 255, 228, 181, 1 )
Color.NavajoWhite	ColorValue( «#ffdead» ) ColorValue( «navajowhite» )	RGBA( 255, 222, 173, 1 )
Color.Navy	ColorValue( «#000080» ) ColorValue( «Navy» )	RGBA( 0, 0, 128, 1 )
Color. OldLace	ColorValue( «#fdf5e6» ) ColorValue( «OLDLACE» )	RGBA( 253, 245, 230, 1 )
Color.Olive	ColorValue( «#808000» ) ColorValue( «Olive» )	RGBA( 128, 128, 0, 1 )
Color.OliveDrab	ColorValue( «#6b8e23» ) ColorValue( «olivedrab» )	RGBA( 107, 142, 35, 1 )
Color.Orange	ColorValue( «#ffa500» ) ColorValue( «Orange» )	RGBA( 255, 165, 0, 1 )
Color.OrangeRed	ColorValue( «#ff4500» ) ColorValue( «ORANGERED» )	RGBA( 255, 69, 0, 1 )
Color. Orchid	ColorValue( «#da70d6» ) ColorValue( «Orchid» )	RGBA( 218, 112, 214, 1 )
Color.PaleGoldenRod	ColorValue( «#eee8aa» ) ColorValue( «palegoldenrod» )	RGBA( 238, 232, 170, 1 )
Color.PaleGreen	ColorValue( «#98fb98» ) ColorValue( «PaleGreen» )	RGBA( 152, 251, 152, 1 )
Color.PaleTurquoise	ColorValue( «#afeeee» ) ColorValue( «PALETURQUOISE» )	RGBA( 175, 238, 238, 1 )
Color.PaleVioletRed	ColorValue( «#db7093» ) ColorValue( «PaleVioletRed» )	RGBA( 219, 112, 147, 1 )
Color. PapayaWhip	ColorValue( «#ffefd5» ) ColorValue( «papayawhip» )	RGBA( 255, 239, 213, 1 )
Color.PeachPuff	ColorValue( «#ffdab9» ) ColorValue( «PeachPuff» )	RGBA( 255, 218, 185, 1 )
Color.Peru	ColorValue( «#cd853f» ) ColorValue( «PERU» )	RGBA( 205, 133, 63, 1 )
Color.Pink	ColorValue( «#ffc0cb» ) ColorValue( «Pink» )	RGBA( 255, 192, 203, 1 )
Color.Plum	ColorValue( «#dda0dd» ) ColorValue( «plum» )	RGBA( 221, 160, 221, 1 )
Color. PowderBlue	ColorValue( «#b0e0e6» ) ColorValue( «PowderBlue» )	RGBA( 176, 224, 230, 1 )
Color.Purple	ColorValue( «#800080» ) ColorValue( «PURPLE» )	RGBA( 128, 0, 128, 1 )
Color.Red	ColorValue( «#ff0000» ) ColorValue( «Red» )	RGBA( 255, 0, 0, 1 )
Color.RosyBrown	ColorValue( «#bc8f8f» ) ColorValue( «rosybrown» )	RGBA( 188, 143, 143, 1 )
Color.RoyalBlue	ColorValue( «#4169e1» ) ColorValue( «RoyalBlue» )	RGBA( 65, 105, 225, 1 )
Color. SaddleBrown	ColorValue( «#8b4513» ) ColorValue( «SADDLEBROWN» )	RGBA( 139, 69, 19, 1 )
Color.Salmon	ColorValue( «#fa8072» ) ColorValue( «Salmon» )	RGBA( 250, 128, 114, 1 )
Color.SandyBrown	ColorValue( «#f4a460» ) ColorValue( «sandybrown» )	RGBA( 244, 164, 96, 1 )
Color.SeaGreen	ColorValue( «#2e8b57» ) ColorValue( «SeaGreen» )	RGBA( 46, 139, 87, 1 )
Color.SeaShell	ColorValue( «#fff5ee» ) ColorValue( «SEASHELL» )	RGBA( 255, 245, 238, 1 )
Color. Sienna	ColorValue( «#a0522d» ) ColorValue( «Sienna» )	RGBA( 160, 82, 45, 1 )
Color.Silver	ColorValue( «#c0c0c0» ) ColorValue( «silver» )	RGBA( 192, 192, 192, 1 )
Color.SkyBlue	ColorValue( «#87ceeb» ) ColorValue( «SkyBlue» )	RGBA( 135, 206, 235, 1 )
Color.SlateBlue	ColorValue( «#6a5acd» ) ColorValue( «SLATEBLUE» )	RGBA( 106, 90, 205, 1 )
Color.SlateGray	ColorValue( «#708090» ) ColorValue( «SlateGray» )	RGBA( 112, 128, 144, 1 )
Color. SlateGrey	ColorValue( «#708090» ) ColorValue( «slategrey» )	RGBA( 112, 128, 144, 1 )
Color.Snow	ColorValue( «#fffafa» ) ColorValue( «Snow» )	RGBA( 255, 250, 250, 1 )
Color.SpringGreen	ColorValue( «#00ff7f» ) ColorValue( «SPRINGGREEN» )	RGBA( 0, 255, 127, 1 )
Color.SteelBlue	ColorValue( «#4682b4» ) ColorValue( «SteelBlue» )	RGBA( 70, 130, 180, 1 )
Color.Tan	ColorValue( «#d2b48c» ) ColorValue( «tan» )	RGBA( 210, 180, 140, 1 )
Color. Teal	ColorValue( «#008080» ) ColorValue( «Teal» )	RGBA( 0, 128, 128, 1 )
Color.Thistle	ColorValue( «#d8bfd8» ) ColorValue( «THISTLE» )	RGBA( 216, 191, 216, 1 )
Color.Tomato	ColorValue( «#ff6347» ) ColorValue( «Tomato» )	RGBA( 255, 99, 71, 1 )
Color.Transparent	ColorValue( «#00000000» ) ColorValue( «Transparent» )	RGBA( 0, 0, 0, 0 )
Color.Turquoise	ColorValue( «#40e0d0» ) ColorValue( «turquoise» )	RGBA( 64, 224, 208, 1 )
Color. Violet	ColorValue( «#ee82ee» ) ColorValue( «Violet» )	RGBA( 238, 130, 238, 1 )
Color.Wheat	ColorValue( «#f5deb3» ) ColorValue( «WHEAT» )	RGBA( 245, 222, 179, 1 )
Color.White	ColorValue( «#ffffff» ) ColorValue( «White» )	RGBA( 255, 255, 255, 1 )
Color.WhiteSmoke	ColorValue( «#f5f5f5» ) ColorValue( «whitesmoke» )	RGBA( 245, 245, 245, 1 )
Color.Yellow	ColorValue( «#ffff00» ) ColorValue( «Yellow» )	RGBA( 255, 255, 0, 1 )
Color. YellowGreen	ColorValue( «#9acd32» ) ColorValue( «YELLOWGREEN» )	RGBA( 154, 205, 50, 1 )

Цвета CSS — НА ПРИМЕРАХ

С помощью цвета CSS можно задать цвет текста, ссылки, цвет фона или любого другого объекта. Все современные браузеры поддерживают 140 названий цветов. 17 названий цветов CSS считаются стандартными, а остальные 123 – дополнительными.

Стандартными цветами CSS считаются следующие: aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, orange, purple, red, silver, teal, white, and yellow.

Существует несколько методов задания CSS цветов. Наиболее распространенные способы следующие:

Задание цвета CSS с помощью английского названия (color: fuchsia).
Задание цвета CSS шестнадцатеричными значением HEX (color: #FF00FF)
Задание цвета CSS десятичным RGB значением (255,0,255).

В данной статье ниже приведена таблица, в которой перечислены все английские названия цветов CSS, а также HEX и RGB коды цветов.

Название	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
DarkGrey	#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
DarkSlateGrey	#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
DimGrey	#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
Grey	#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
LightGrey	#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
LightSlateGrey	#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
RebeccaPurple	#663399	102, 51, 153
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
SlateGrey	#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

Теперь вы знаете, где можно посмотреть цвета CSS, а каким способом их задавать уже ваше решение.

CSS: Использовать сокращенные шестнадцатеричные цвета — шестнадцатеричная сокращенная запись оптимизирует css

Главная » CSS: используйте сокращенные шестнадцатеричные цвета — шестнадцатеричная сокращенная запись, оптимизация CSS

12 августа 2018 г. 14 июня 2004 г.

Резюме:

Сокращенная шестнадцатеричная нотация заменяет 3-символьные значения цвета на 6-символьные цвета, когда каждый из цветовых каналов идентичен в шестнадцатеричном триплете RRGGBB. Сокращенные шестнадцатеричные цвета могут помочь оптимизировать ваши таблицы стилей, особенно в сочетании с сокращенными свойствами и группировкой.

Сокращенная шестнадцатеричная нотация сокращает 6-символьные цвета RRGGBB CSS до 3-символьных сокращений RGB. В сочетании с сокращенными свойствами и группировкой, сокращенные шестнадцатеричные цвета могут значительно сократить таблицы стилей, часто на 50%.

Цвета в CSS

Существует пять способов задания цветов в CSS; четыре используют числовые значения RGB, а один использует именованные цвета. Двумя наиболее эффективными способами являются шестнадцатеричные и именованные цвета. Шестнадцатеричные цвета бывают двух видов: триплеты RGB и сокращенная запись. Вместо этого:

 .orange {color:#ff6600;}

Сделайте так:

 .orange {color:#f60;}

Шестнадцатеричные цвета

Шестнадцатеричные значения имеют основание 16, поэтому они обычно короче, чем числа в основании 10 . Чтобы указать от 0 до 255 в шестнадцатеричном формате, вы должны использовать от 00 до ff , сохраняя байт для более высоких цветов.

Сокращенные шестнадцатеричные цвета

Почти все браузеры (версия 3 и выше, кроме IE3 Mac) поддерживают сокращенные шестнадцатеричные цвета. Триплеты RGB могут быть сокращены, если каждая из красных, зеленых и синих шестнадцатеричных пар одинакова. Таким образом, когда вы используете цвета, в которых есть три пары, вы можете сокращать каждый цветовой канал, используя один символ вместо двух одинаковых символов. Итак:

 .dark-yellow {color:#ffcc00;}

Становится таким:

 .dark-yellow {color:#fc0;}

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

Именованные цвета

В большинстве случаев использование сокращенных шестнадцатеричных цветов является наиболее эффективным способом указания цветов. Однако в некоторых случаях именованные цвета короче, чем их шестнадцатеричные эквиваленты. 16 именованных цветов, поддерживаемых спецификациями HTML и XHTML, показаны в таблице 1.

Таблица 1: Эквиваленты именованных цветов
Цвет	Пара шестигранников	Короткий шестигранник
Цвет морской волны	#00ffff	#0ff
Черный	#000000	#000
Синий	#0000ff	#00f
Фуксия	#ff00ff	#f0f
Серый	#808080
Зеленый	#008000
Лайм	#00ff00	#0f0
Бордовый	#800000
Военно-морской флот	#000080
Олива	#808000
Фиолетовый	#800080
Красный	#ff0000	#f00
Серебро	#c0c0c0
Бирюзовый	#008080
Белый	#ffffff	#fff
Желтый	#ffff00	#ff0

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

Web-Safe Colors

Так называемый Web-безопасный цветовой куб состоит из 216 цветов, общих для платформ ПК и Mac, которые отображаются одинаково и не демонстрируют какого-либо цветового сдвига или сглаживания. В большинстве случаев так оно и есть. Цвета, безопасные для Интернета, выражаются кратными 20% и 51 для значений RGB и 33 в шестнадцатеричном формате. Таким образом, чтобы создать безопасный для Интернета цвет, используйте любую комбинацию из 00 , 33 , 66 , 99 , cc и ff . Веб-безопасные цвета всегда можно сократить, используя сокращенную шестнадцатеричную нотацию.

Заключение

Сокращенная шестнадцатеричная запись заменяет 3-символьные значения цвета на 6-символьные цвета, когда каждый из цветовых каналов идентичен в шестнадцатеричном триплете RRGGBB. Сокращенные шестнадцатеричные цвета сохраняют три байта для каждого сокращенного цвета. В сочетании с сокращенными свойствами, группировкой, потомками и селекторами типов высокого уровня сокращенные шестнадцатеричные цвета могут помочь оптимизировать ваши таблицы стилей до их минимального размера.

Дополнительная литература

Домашняя страница CSS: Из W3C
Оптимизация CSS: Краткое изложение главы по оптимизации CSS из Ускорьте свой сайт: оптимизация веб-сайта .
Каскадные таблицы стилей, уровень 2 Спецификация CSS2: Спецификация CSS от W3C. Берт Бос и др.
Таблицы поддержки CSS: Эрик Мейер. Основная сетка ссылок CSS.
Каскадные таблицы стилей: полное руководство, 2-е изд. 902:30: Второе издание этой классической книги, недавно обновленное для CSS 2.1, объясняет, как работает CSS, как ничто другое. CSS, CSS1, CSS2.1 сопровождаются понятными примерами и фрагментами кода. Сокращенные свойства и цвета, группировка и позиционирование могут помочь вам сократить разметку как CSS, так и XHTML. Эта книга является незаменимым справочником для веб-авторов. Автор Эрик Мейер (сопутствующий сайт).
CSS: используйте селекторы потомков: — это элегантный способ применить стили к определенным областям вашей страницы, уменьшая при этом необходимость встраивать классы в элементы. Из настройки скорости недели.
CSS: групповые селекторы и объявления: Группируя селекторы CSS, которые используют одно и то же объявление, и объявления, которые используют один и тот же селектор, вы можете применить несколько объявлений к нескольким селекторам, чтобы оптимизировать свои таблицы стилей. Из настройки скорости недели.
CSS: использование сокращенных свойств: Сокращенные свойства группируют связанные правила в одну сокращенную запись. Сокращенные свойства — это эффективный способ уменьшить ваши таблицы стилей. Из настройки скорости недели.
CSS: использование селекторов типов: Высокоуровневые селекторы типов стилизуют одинаковые элементы документа без необходимости использования дополнительных классов. Из настройки скорости недели.

«Помидор» против «#FF6347» — трагикомическая история названий цветов CSS

Бизнес и ИТ —

Юлианна Тветен — 11 октября 2015 г. 21:30 UTC

Раздел «Именованные цвета» модуля цветов CSS уровня 4 — последней спецификации для значений и свойств цвета в языке каскадных таблиц стилей — содержит 141 стандартный цвет. У каждого есть свое имя, поэтому помимо основных «черного» и «белого» есть такие оттенки, как «папайя», теплая оранжевая пастель; «лимонный шифон» — слабый молочно-желтый; и «берливуд», который, вероятно, появился на шортах гида-сафари.

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

Ответы на эти вопросы начинаются в Массачусетсе 1980-х годов. Первоначально цвета были продуктом X Window System (X), графического пользовательского интерфейса (GUI), выпущенного Массачусетским технологическим институтом в 1984 году. , поставляемый с третьим выпуском десятой версии X (X10R3). В него вошли 69основные оттенки со 138 элементами для учета различных регистров в названиях цветов (например, строчные буквы с интервалом, например «темно-красный», по сравнению с верблюжьим регистром, например «темно-красный»).

В 1988 году появился X11R2 с добавлением трех цветов, включая идентичные оттенки «серый» и «серый». По словам разработчика из Остина Алекса Секстона, обсуждавшего цвета на конференции JavaScript в прошлом году, программисты Hewlett-Packard не могли вспомнить правильное написание (первоначально оно было с буквой «а»). предотвратит ошибки.

Самый существенный релиз, созданный Полом Равелингом, вышел в 1989 году с X11R4. Это обновление ознаменовало появление множества светлых нейтральных тонов и стало ответом на жалобы коллег Равелинга на точность цветопередачи. (В 80-х цвета могли сильно различаться от монитора к монитору, в зависимости от поставщика оборудования. Как бы иллюстрируя это, особенно сбитый с толку сотрудник воскликнул: «Это пшеница???!!!», увидев оттенок в в предыдущем текстовом файле.) В этой версии программисты познакомились с вышеупомянутыми «папайейным взбитым» и «лимонным шифоном», а также с другими оттенками с возвышенными названиями, такими как «бланшированный миндаль» и «персиковый слой».

Равелинг взял эти названия из вполне ожидаемого источника: (ныне несуществующей) компании по производству красок Sinclair Paints. Это был произвольный ход; не получив санкции от Американского национального института стандартов (ANSI), который издал стандарты для свойств цвета в Интернете, Равелинг решил взять дело в свои руки. Он откалибровал цвета для своего собственного монитора HP. «Без ума от ANSI и «стандартов ANSI», — пожаловался он.

Позже в том же году X11 получил набор более смелых цветов благодаря другому программисту, Джону К. Томасу. Точно так же, как в обновлении Равелинга были изменены оттенки, чтобы смягчить замешательство пользователей, Томас ответил на следующее письменное возражение от коллеги Брюса Шухардта в 19:00.89:

«[Я] до сих пор в шоке и ужасе от цветов по умолчанию в базе данных rgb. «Розовый» цвет, в частности, выглядит как телесный тон человека, которого тошнит уже несколько часов и который действительно скорее получит пулю в голову, чем продолжит жить».

Томас согласился. Разочарованный непоследовательными отображениями, он начал находить бесполезным стандартизацию названий цветов. В ответ он заявил в электронном письме, что «однажды вечером сел с самым удобным стандартом субъективных названий цветов, коробкой с 72 мелками Crayola». назовите несколько.

К 2001 году Консорциум World Wide Web (W3C) опубликовал первый рабочий проект цветового модуля CSS 3, который включал цвета. В свете развития технологий цвета вышли из употребления, но W3C заявил, что цель состоит в том, чтобы «кодифицировать существующие методы». На тот момент все браузеры поддерживали цвета, следовательно, W3C использовал их в тестах на совместимость. Таким образом, включение цветов в CSS предотвратит поломку сайтов.

«Это было похоже на обратную совместимость. Они подумали: «Мы случайно сделали это, так что мы могли бы просто не нарушать это», — сказал Секстон Ars.

Последовала обратная реакция. База данных цветов подвергалась прихотям стольких разных программистов, что стала глубоко дезорганизованной, что заставило некоторых утверждать, что ей не место в CSS. Критики подвергли критике его схему именования: «темно-серый» был светлее «серого»; был «средне-фиолетово-красный», но не «фиолетово-красный»; «светло-желтый золотарник» не имел соответствующего «желтого золотарника». Всего у 17 цветов были темные версии, но только у 13 были светлые. Распределение цветов также было неравномерным, с уклоном в сторону красного и зеленого и в сторону от синего.

Возможно, самое яростное осуждение исходит из электронного письма 2002 года, написанного программистом Стивеном Пембертоном: «Названия цветов X11 — это мерзость, которую следовало задушить при рождении, и добавление их в CSS — это пятно на превосходном дизайне CSS. Сказать, что набор цветов X11 и их названия были «разработаны», — значит оскорбить слово «дизайн». Это просто беспорядок».

Другим спорным моментом была культурная изоляция. Некоторые программисты обиделись на регионально-ориентированный характер таких названий, как «голубой ловкач» и потенциальные расовые оттенки «белого навахо» (от Sinclair Paints) и «красного индейца» (от Crayola, хотя с тех пор мелок был переименован в ответ на это). к тем же заботам). Другие считали имена только на английском языке отталкивающими.

«Я не являюсь носителем английского языка. Представьте мою реакцию, когда я впервые увидел цвет «гейнсборо» или «хлыст папайи», — сказал Ars Даниэль Глазман, сопредседатель рабочей группы CSS.

Якобы эти последствия можно было предотвратить. В 80-х у программистов системы X была возможность идентифицировать цвета так, как это делают многие разработчики сегодня: с помощью шестнадцатеричного значения (шестнадцатеричное значение AKA, например, #FFFF00) или цветового кода RGB (например, 255,255,0). Эти варианты обеспечивают большую степень выбора и точности, и они основаны на схематических, объективных, глобально читаемых системах. Почему их не использовали изначально?

«Это было признанием того, что почти никто не любит использовать числовые значения. Люди не думают о F5B как об определенном оттенке цвета. Использование имени более естественно», — сказал Джим Фултон, студент Массачусетского технологического института во время создания X и менеджер файлов Равелинга и Томаса. Однако он признал: «Не каждая идея работает хорошо».

Однако в 2014 году неожиданное событие представило список цветов в более благоприятном свете: появился новый оттенок. Название «Rebecca Purple» было введено в память о жизни Ребекки Мейер, дочери Эрика Мейера, уважаемого программиста и CSS-писателя. Ребекка умерла от рака мозга в возрасте шести лет; оттенок (#663399) был выбран, чтобы отразить ее любимый цвет. (Некоторые разработчики выступили против добавления, утверждая, что набор стандартов не место для эмоциональной дани. Они были отвергнуты как скряги.)

Тем не менее, общее мнение таково, что полезность этих цветов минимальна; их лучше всего зарезервировать в качестве заполнителей (проще набрать «помидор», чем «# FF6347», когда вам нужен цвет быстро), для дизайнерских проектов начального уровня или в качестве предмета шутки.

«Я с удивлением смотрю на то, что цвета, похоже, перекочевали в CSS. Я просто смеюсь над этим», — сказал Фултон Ars. «Я думаю, что если бы кто-то пошел и просканировал 100 или 1000 лучших сайтов и посмотрел, как определяются различные цвета, я готов поспорить, что вы все равно найдете почти нулевой процент, используя названия цветов помимо «белый». или «черный».

«Если я делаю пример, чтобы показать людям, как использовать редактор или фреймворк, я использую шестнадцатеричные значения, такие как #C0FFEE или #BADA55. Использовать #C0FFEE примерно так же полезно, как и использовать «кнут из папайи», — добавил Секстон.

Нужно ли было оставить цвета без стандартных названий, чтобы уберечь сообщество разработчиков от серии гневных электронных писем и микроспоров? По Фултону, наверное. С другой стороны, когда программисты бродили по неизведанной территории графических интерфейсов с цветным дисплеем в 80-х, было вполне естественно экспериментировать так, как они знали.

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

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

цветов в HTML

Вы здесь: Справочник > приложение > html > цвета

Цвета могут быть указаны в HTML-документе тремя различными способами: с использованием цветовых методов (RGB, RGBA, HSL, HSLA), шестнадцатеричных значений цвета и предопределенных имен цветов. Вы можете использовать эти цвета для значения нескольких атрибутов (bgColor, borderColor, aLink, layout-color и т. д.).

Цветовые методы
Шестнадцатеричные цвета
Предопределенные имена цветов
- Кроссбраузерные названия цветов
- Специальные цвета Safari и Google Chrome

Цветовые методы (RGB, RGBA, HSL, HSLA) широко поддерживаются в CSS, но в HTML они поддерживаются только Google Chrome и Safari, а цветовой метод RGB — в Internet Exporer. Для кросс-браузерной совместимости используйте вместо этого шестнадцатеричные цвета или предопределенные имена цветов. Дополнительные сведения о цветовых методах см. на странице «Цвета в CSS».

Шестнадцатеричные значения цвета поддерживаются всеми широко используемыми браузерами. Шестнадцатеричный цвет может быть определен в форме «#RRGGBB», где шестнадцатеричные целые числа RR (красный), GG (зеленый) и BB (синий) определяют компоненты цвета. Все значения должны быть между 0 и FF (десятичное число 255), они определяют интенсивность компонента. Например, значение «#0000FF» отображается как синий, потому что для синего компонента установлено самое высокое значение ( FF ), а остальные — 0 .

Следующая таблица содержит предопределенные названия цветов и их эквиваленты в формате RGB и шестнадцатеричном формате.

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

Safari и Google Chrome поддерживают имена пользовательских цветов, которые являются ссылками на используемые в настоящее время цвета элементов пользовательского интерфейса.

активная граница	Цвет активной границы по умолчанию.
активный заголовок	Цвет активной подписи по умолчанию.
рабочая область приложения	Цвет рабочей области приложения по умолчанию.
фон	Цвет фона по умолчанию.
кнопка	Цвет лицевой стороны кнопки по умолчанию.
подсветка кнопок	Цвет выделенной по умолчанию кнопки.
пуговичная тень	Цвет тени кнопки по умолчанию.
текст кнопки	Цвет текста кнопки по умолчанию.
текст заголовка	Цвет текста подписи по умолчанию.
серый текст	Цвет серого текста по умолчанию.
подсветка	Цвет выделения по умолчанию.
выделенный текст	Цвет выделенного текста по умолчанию.
неактивная граница	Цвет неактивной границы по умолчанию.
неактивный заголовок	Цвет неактивной подписи по умолчанию.
инактивкаптионтекст	Цвет неактивного текста подписи по умолчанию.
информационный фон	Цвет фона информации по умолчанию.
информационный текст	Цвет информации по умолчанию.
совпадение	Подбор цвета.
меню	Цвет меню по умолчанию.
текст меню	Цвет текста меню по умолчанию.
полоса прокрутки	Цвет полосы прокрутки по умолчанию.
триддтемная тень	Цвет тени по умолчанию для трехмерного изображения.
трехгранник	Цвет лица троицы по умолчанию.
тридхайлайт	Цвет выделенной по умолчанию тройки. Навигация по записям Работа в группе: ВСЕ, что необходимо знать учителю о групповой работе Кнопки для сайта сделать онлайн: Онлайн генератор кнопок для сайта Добавить комментарий Отменить ответ Ваш адрес email не будет опубликован. Обязательные поля помечены * Комментарий * Имя * Email * Сайт Рубрики Css Html Js Адаптивный сайт Верстка Идеи С чего начать Советы Шаблоны Разное © Компания Вебджем.рф 2009 - 2024 \| Все права защищены.