NexxDigital - компьютеры и операционные системы

28.11.14 11.1K

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

Цветовая гамма в html

В html цвет может быть задан в нескольких форматах:

1. В виде шестнадцатеричного значения – используются код, заданный в шестнадцатеричной системе исчисления. Такие коды цветов в html состоят из трех пар шестнадцатеричных чисел. Каждая пара отвечает за насыщенность оттенка своим основным цветом:

  • Первая числовая пара – отвечает за красный цвет;
  • Вторая пара – за содержание зеленого цвета;
  • Последняя – за содержание синего цвета.

В начале кода (перед цифрами ) ставится решетка. Так обозначается шестнадцатеричный цветовой код. Кроме чисел от 1 до 9 в этой системе исчисления используются буквы латинского алфавита (A, B, C, D, E, F).

Например, код белого цвета в html будет иметь вид #FFFFFF :


2. Ключевым словом – сейчас html поддерживает около 147 ключевых слов. Но не все из этих слов являются уникальными. Некоторые из них ссылаются на один и тот же цветовой оттенок.

Серый цвет обозначается двумя ключевыми словами: grey и gray . Их шестнадцатеричный код (HEX ) задается одним и тем же значением #808080 .

Пример :

#808080




3. В формате RGB – эта кодировка цветов в html основана на использовании трех значений, задаваемых в диапазоне от 0 до 255. Каждое из них определяет насыщенность оттенка одним из основных цветов:
  • R – красный (red );
  • G – зеленый (green );
  • B – синий (blue ).

Номер цвета в формате RGB записывается в таком виде: rgb(0, 210, 100).

background-color:rgb(100,186,43)


4. В формате RGBA – он представляет собой усовершенствованный формат RGB , где четвертым значением задается прозрачность цвета в виде десятичной дроби от 0 до 1.

Пример использования:

background-color:rgba(100,86,143,0.2)

background-color:rgba(100,86,143,0.5)

background-color:rgba(100,86,143,0.8)

background-color:rgba(100,86,143,1)

Таблицы цветов html и генераторы цвета

При таком большом разбросе форматов установки цвета легко запутаться. Поэтому была придумана специальная таблица цветов. В ней к 147 ключевым названиям цветовых оттенков приведены коды соответствия во всех основных стандартах представления цвета. Дополнительно каждое поле снабжено планкой для визуального подбора цвета. Одна из таких таблиц представлена на сайте colorscheme.ru :


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

Чтобы обойти эту преграду и максимально упростить подбор нужного оттенка, были разработаны интерактивные веб-сервисы. Их пользовательский интерфейс может несколько разниться между собой.

На сайте html-color-codes.info генератор цветов имеет такой вид:


А в рамках сервиса color-picker.appsmaster.co этот инструмент реализован немного иначе:


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

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

Техника безопасности при работе с цветом

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

Тогда была выведена великая таблица безопасных цветов. В ней указывалось 216 оттенков, которые могли быть отображены без искажения в любом из браузеров того времени. И по сей день эта «великая рукопись » еще доступна на некоторых ресурсах:


В наше время все изменилось. Поэтому все правила техники безопасности при работе с цветом в html полностью аннулируются. Ведь современное компьютерное железо поддерживает более 16 миллионов различных оттенков. И 216 безопасных цветов канули в лету.

Коды Майнкрафт цветов , или же Майнкрафт коды форматирования, позволяют любому игроку добавлять цветы и всячески форматировать текст прямо в Minecraft. Цветовые коды от &0-9 — до &a-f. Добавьте их перед вашим текстом. Сообщения от игроков могут содержать цветовые коды, которые позволяют добавлять краски в ваши предложения.

Цвета и коды форматирования

Знак амперсанта (&), за которым идёт шестнадцатеричное число в сообщения даёт сигнал клиенту для переключения цвета при отображении текста. Кроме того, текст может быть отформатирован с помощью символа &, за которым следует буква. Вы можете добавлять различные цвета в книги, командные блоки, имя сервера, описание сервера (motd), в название миров, в таблички и даже в имена игроков.

Очень легко отформатировать ваш текст в конфигах или в игре, используя таблицу цветов ниже. &r используется для сброса всех кодов, т.е. &mААА&rБББ будет отображаться как ААА БББ.

Представляем таблицу существующих цветовых кодов в Майнкрафт для вашего удобства:

Код Название Тех.Название Цвет символа Цвет тени символа
R G B Hex R G B Hex
&0 Черный black 0 0 0 000000 0 0 0 000000
&1 Тёмно-синий dark_blue 0 0 170 0000AA 0 0 42 00002A
&2 Тёмно-зелёный dark_green 0 170 0 00AA00 0 42 0 002A00
&3 Тёмно-сине-зелёный dark_aqua 0 170 170 00AAAA 0 42 42 002A2A
&4 Тёмно-красный dark_red 170 0 0 AA0000 42 0 0 2A0000
&5 Тёмно-фиолетовый dark_purple 170 0 170 AA00AA 42 0 42 2A002A
&6 Золотой gold 255 170 0 FFAA00 42 42 0 2A2A00
&7 Серый gray 170 170 170 AAAAAA 42 42 42 2A2A2A
&8 Тёмно-серый dark_gray 85 85 85 555555 21 21 21 151515
&9 Голубой blue 85 85 255 5555FF 21 21 63 15153F
&a Зелёный green 85 255 85 55FF55 21 63 21 153F15
&b Сине-зелёный aqua 85 255 255 55FFFF 21 63 63 153F3F
&c Красный red 255 85 85 FF5555 63 21 21 3F1515
&d Светло-фиолетовый light_purple 255 85 255 FF55FF 63 21 63 3F153F
&e Жёлтый yellow 255 255 85 FFFF55 63 63 21 3F3F15
&f Белый white 255 255 255 FFFFFF 63 63 63 3F3F3F

Иногда бывает нужно подчеркнуть, зачеркнуть, выделить какой-либо текст . Для этого используется форматирование текста. Используется точно так же как и цвета(перед текстом ставим код , например &lMinecraft = Minecraft.

Для вашего удобства ниже приведена таблица кодов для форматирования:

Код Название
&k Магический текст
&l Жирный текст
&m Зачеркнутый текст
&n Подчеркнутый текст
&o Курсивный текст
&r Текст без форматирования

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

Вы можете задать свои значения цвета в различных форматах. В следующей таблице перечислены все возможные форматы:

Ниже более подробно описаны перечисленные форматы.

Цвета CSS - шестнадцатеричные коды

Шестнадцатеричный код цвета - это шестизначное представление цвета. Первые две цифры (RR) - представляют собой красное значение, следующие две - это зеленое значение (GG), а последние - синее значение (BB).

Цвета CSS - короткие шестнадцатеричные коды

Короткий шестнадцатеричный код цвета - это более короткая форма шестизначной нотации. В этом формате каждая цифра повторяется, чтобы получить эквивалентное шестизначное значение цвета. Например: #0F0 становится #00FF00.

Шестнадцатеричное значение может быть взято из любого графического программного обеспечения, такого как Adobe Photoshop, Core Draw и др.

Каждому шестнадцатеричному коду цвета в CSS будет предшествовать знак хеша «#». Ниже приведены примеры использования шестнадцатеричных обозначений.

Цвета CSS - RGB значения

RGB значение - это код цвета, который задается с помощью свойства rgb(). Это свойство принимает три значения: по одному для красного, зеленого и синего. Значение может быть целым числом, от 0 до 255, или процентом.

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

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

Генератор цветовых кодов

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

Безопасные цвета браузера

Ниже представлена таблица из 216 цветов, которые наиболее безопасные и независимые от компьютера. Эти цвета в CSS варьируются от 000000 до FFFFFF шестнадцатеричного кода. Они безопасны в использовании, поскольку гарантируют, что все компьютеры будут правильно отображать цвет при работе с 256 цветовой палитрой.

Таблица «безопасных» цветов в CSS
#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


Если заметили ошибку, выделите фрагмент текста и нажмите Ctrl+Enter
ПОДЕЛИТЬСЯ:
NexxDigital - компьютеры и операционные системы