• Сине фиолетовый цвет rgb. Учeбник HTML. Цвета RGB. Цвета безопасной палитры

    >>Управление цветом

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

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

    Во втором же случае за основу принимается черный цвет экрана монитора, каждая ячейка которого, светится одним из трех цветов: red -красный, green -зеленый и blue -синий. Тогда при полном отсутствии какого-либо свечения мы получаем чистый черный цвет экрана, а любой из требуемых цветов задается соотношением каждого из трех цветов. В этом случае мы получим RGB -способ передачи цвета. Основные цвета могут иметь значения от 0 до 255 , или от 0% до 100% , либо могут быть представлены в виде шестнадцатеричного значения. На рисунке ниже можно увидеть результаты смешения основных цветов.

    Шестнадцатеричная система счисления, в отличии от десятичной в своём ряду цифр имеет не десять знаков, а шестнадцать - отсюда и название. Соответственно не повторяющихся вариантов сочетаний из двух цифр может быть только - 256 , для продолжения ряда цифр после 9 используются буквы от A до F , следовательно, ряд будет выглядеть так -

    0,1,2,3,4,5,6,7,8,9,A,B,C,D,E,F.
    Для перевода чисел из одной системы счисления в другую и наоборот воспользуйтесь калькулятором, приведенным ниже. Максимальное значение здесь может быть FF - 255 .

    В этом случае цвет задается тремя шестнадцатеричными числами, каждое из которых состоит из двух цифр. Первое число определяет интенсивность красного цвета, среднее- зеленого , последнее- синего цвета. Все числа могут принимать значения в диапазоне от 00 до FF (от 0 до 255). Например: зеленый цвет задается как #00FF00 , красный - как #FF0000 , синий - как #0000FF , белый - как #FFFFFF , полное отсутствие цвета или черный задается как #000000 .

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

    RED GREEN BLUE
    0 1 2 3 4 5 6 7 8 9 a b c d e f 0 1 2 3 4 5 6 7 8 9 a b c d e f 0 1 2 3 4 5 6 7 8 9 a b c d e f 0 1 2 3 4 5 6 7 8 9 a b c d e f 0 1 2 3 4 5 6 7 8 9 a b c d e f
    ...кликни здесь

    Примеры некоторых шестнадцатеричных значений цветов RGB: градации красного, синего и зеленого цветов.

    вид код вид код вид код вид код вид код вид код
    #010000 #800000 #000100 #008000 #000001 #000080
    #100000 #900000 #001000 #009000 #000010 #000090
    #200000 #A00000 #002000 #00A000 #000020 #0000A0
    #300000 #B00000 #003000 #00B000 #000030 #0000B0
    #400000 #C00000 #004000 #00C000 #000040 #0000C0
    #500000 #D00000 #005000 #00D000 #000050 #0000D0
    #600000 #E00000 #006000 #00E000 #000060 #0000E0
    #700000 #FF0000 #007000 #00FF00 #000070 #0000FF

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

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

    вид имя вид имя вид имя вид имя
    White Red Orange Yellow
    Green Blue Purple Black
    Aliceblue Antiquewhite Aqua Aquamarine
    Azure Beige Bisque Blanchedalmond
    Blueviolet Brown Burlywood Cadetblue
    Chartreuse Chocolate Coral Cornflowerblue
    Cornsilk Crimson Cyan Darkblue
    Darkcyan Darkgoldenrod Darkgray Darkgreen
    Darkkhaki Darkmagenta Darkolivegreen Darkorange
    Darkorchid Darkred Darksalmon Darkseagreen
    Darkslateblue Darkslategray Darkturquoise Darkviolet
    Deeppink Deepskyblue Dimgray Dodgerblue
    Firebrick Floralwhite Forestgreen Fuschia
    Gainsboro Ghostwhite Gold Goldenrod
    Gray Greenyellow Honeydew Hotpink
    Indianred Indigo Ivory Khaki
    Lavender Lavenderblush Lemonchiffon Lightblue
    Lightcoral Lightcyan Lightcoldenrodyellow Lightgreen
    Lightgray Lightpink Lightsalmon Lightseagreen
    Lightskyblue Lightslategray Lightsteelblue Lightyellow
    Lime Limegreen Linen Magenta
    Maroon Mediumaquamarine Mediumblue Mediumorchid
    Mediumpurple Mediumseagreen Mediumslateblue Mediumspringgreen
    Mediumturquoise Mediumvioletred Midnightblue Mintcream
    Mistyrose Navajowhite Navy Oldlace
    Olive Olivedrab Orangered Orchid
    Palegoldenrod Palegreen Paleturquoise Palevioletred
    Papayawhip Peachpuff Peru Pink
    Plum Powderblue Rosybrown Royalblue
    Saddlebrown Seagreen Seashell Sienna
    Silver Skyblue Slateblue Slategray
    Snow Springgreen Steelblue Tan
    Teal Thistle Tomato Turquoise
    Violet Wheat Whitesmoke Yellowgreen
    Перечень строчных литералов с названиями цветов довольно обширен и более чем достаточен. Если необходимо задать в качестве фонового цвет настолько необычный, что ему даже нет названия, то можно воспользоваться шестнадцатеричным значением.

    Использование безопасной палитры цветов

    К сожалению, на разных платформах, с разными системными настройками, правильная передача цвета является проблемой. Все дело в том, что браузер всегда старается подстроить цветовую палитру документа под системные настройки и возможности монитора, путем самостоятельного смешивания цветов и их замещения. Как результат - иногда пользователь видит не совсем то, что хотел ему показать web-мастер. Выход из этой ситуации был найден в применении палитры, каждый цвет которой гарантированно передается одинаково всеми браузерами на разных платформах. Это так называемая гарантированная палитра, еще ее называют безопасной палитрой. В эту палитру входят цвета, цветовые составляющие которых, принимают следующие значения:00 ,33 ,66 ,99 , CC ,FF , во всех возможных 216 их сочетаниях.

    FFFFFF CCCCCC 999999 666666 333333 000000 CCCC66 CCCC33 999966 999933 999900 666600 CCFF66 CCFF00 CCFF33 CCCC99 666633 333300 99FF00 99FF33 99CC66 99CC00 99CC33 669900 CCFF99 99FF99 66CC00 66CC33 669933 336600 66FF00 66FF33 33FF00 33CC00 339900 009900 33FF33 00FF33 00FF00 00CC00 33CC33 00CC33 CCFFCC 99CC99 66CC66 669966 336633 003300 99FF99 66FF66 33FF66 00FF66 339933 006600 66FF99 33FF99 00FF99 33CC66 00CC66 009933 66CC99 33CC99 00CC99 339966 009966 006633 99FFCC 66FFCC 33FFCC 00FFCC 33CCCC 009999 CCFFFF 99FFFF 66FFFF 33FFFF 00FFFF 00CCCC 99CCCC 66CCCC 339999 669999 006666 336666 66CCFF 33CCFF 00CCFF 3399CC 0099CC 003333 99CCFF 3399FF 0099FF 6699CC 336699 006699 0066FF 3366CC 0066CC 0033FF 003399 003366 6699FF 3366FF 0000FF 0000CC 0033CC 000033 3333FF 3300FF 3300CC 3333CC 000099 000066 9999CC 6666FF 6666CC 666699 333399 333366 CCCCFF 9999FF 6666FF 6600FF 330099 330066 9966CC 9966FF 6600CC 6633CC 663399 330033 CC99FF CC66FF 9933FF 9900FF 660099 663366 CC66FF CC33FF CC00FF 9900CC 996699 660066 CC99CC CC66CC CC33CC CC00CC 990099 993399 FFCCFF FF99FF FF66FF FF33FF FF00FF CC3399 FF66CC FF00CC FF33CC CC6699 CC0099 990066 FF99CC FF3399 FF0099 CC0066 993366 660033 FF6699 FF3399 FF0066 CC3366 996666 663333 CC9999 CC6666 CC3333 CC0000 990033 330000 FFCCCC FF9999 FF6666 FF3333 FF0000 CC0033 FF6633 CC3300 FF3300 FF0000 CC0000 990000 FFCC99 FFCC66 FF6600 CC6633 993300 660000 FF9900 FF9933 CC9966 CC6600 996633 663300 FFCC66 FFCC00 FFCC33 CC9900 CC9933 996600 FFFFCC FFFF99 FFFF66 FFFF33 FFFF00 CCCC00
    вид код вид код вид код вид код вид код вид код

    Коды Майнкрафт цветов , или же Майнкрафт коды форматирования, позволяют любому игроку добавлять цветы и всячески форматировать текст прямо в 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 Текст без форматирования

    В HTML цвет можно задавать тремя способами:

    Задание цвета в HTML по его названию

    Некоторые цвета можно задавать по их названию, используя в качестве значения название цвета на английском языке. Самые распространенные ключевые слова: black (черный), white (белый), red (красный), green (зеленый), blue (синий) и др:

    Цвет текста – красный

    Наиболее популярные цвета стандарта Консорциума Всемирной паутины (англ. World Wide Web Consortium, W3C):

    Цвет Название Цвет Название Цвет Название Цвет Название
    Black Gray Silver White
    Yellow Lime Aqua Fuchsia
    Red Green Blue Purple
    Maroon Olive Navy Teal

    Пример использования различных цветовых названий:

    Пример: задание цвета по его названию

    Заголовок на красном фоне

    Заголовок на оранжевом фоне

    Заголовок на фоне лайм

    Белый текст на синем фоне

    Заголовок на красном фоне

    Заголовок на оранжевом фоне

    Заголовок на фоне лайм

    Белый текст на синем фоне

    Задание цвета с помощью RGB

    При отображении различных цветов на мониторе за основу берется RGB-палитра. Любой цвет получают, смешивая три основных: R — красный (red) , G — зеленый (green) , В — синий (blue) . Яркость каждого цвета задается одним байтом и, следовательно, может принимать значения от 0 до 255. Например, RGB (255,0,0) отображается как красный, так как красный устанавливается в его самое высокое значение (255), а остальные установлены в 0. Также можно задавать цвет в процентном отношении. Каждый из параметров обозначает уровень яркости соответствующего цвета. Например: значения rgb(127, 255, 127) и rgb(50%, 100%, 50%) будут задавать одинаковый зеленый цвет средней насыщенности:

    Пример: Задание цвета с помощью RGB

    rgb(127, 255, 127)

    rgb(50%, 100%, 50%)

    rgb(127, 255, 127)

    rgb(50%, 100%, 50%)

    Задание цвета по шестнадцатеричному значению

    Значения R G B также могут быть указаны с помощью шестнадцатеричных (HEX) значений цвета в форме: #RRGGBB, где RR (красный), GG (зеленый) и BB (синий) являются шестнадцатеричными значениями от 00 до FF (так же, как десятичное 0-255). Шестнадцатеричная система, в отличие десятичной системы, базируется, как следует из ее названия, на числе 16. Шестнадцатеричная система использует следующие знаки: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, А, В, С, D, E, F. Здесь цифры от 10 до 15 заменены латинскими буквами. Числа больше 15 в шестнадцатеричной системе представляют из себя объединением двух знаков в одно значение. Например, наибольшему числу 255 в десятичной системе соответствует самое высокое значение FF в шестнадцатеричной системе. В отличие десятичной системы, перед шестнадцатеричным числом ставят символ решетки # , например, #FF0000 отображается как красный цвет, так как красный устанавливается в его самое высокое значение (FF), а остальным цветам установлено минимальное значение (00). Знаки после символа решетки # можно набирать как прописными, так и строчными. Шестнадцатеричная система позволяет использовать сокращенную форму вида #rgb, где каждый символ равнозначен удвоенному. Так, запись #f7O следует расценивать как #ff7700.

    Пример: Цвет HEX

    красный: #FF0000

    зеленый: #00FF00

    синий: #0000FF

    красный: #FF0000

    зеленый: #00FF00

    синий: #0000FF

    красный+зеленый=желтый: #FFFF00

    красный+синий=фиолетовый: #FF00FF

    зеленый+синий=голубой: #00FFFF

    Список широко распространённых цветов (название, HEX и RGB):

    Английское название Русское название Образец HEX RGB
    Amaranth Амарантовый #E52B50 229 43 80
    Amber Янтарный #FFBF00 255 191 0
    Aqua Сине-зеленый #00FFFF 0 255 255
    Azure Лазурный #007FFF 0 127 255
    Black Черный #000000 0 0 0
    Blue Синий #0000FF 0 0 255
    Bondi Blue Вода пляжа Бонди #0095B6 0 149 182
    Brass Латунный #B5A642 181 166 66
    Brown Коричневый #964B00 150 75 0
    Cerulean Лазурный #007BA7 0 123 167
    Dark spring green Тёмный весенне-зелёный #177245 23 114 69
    Emerald Изумрудный #50C878 80 200 120
    Eggplant Баклажановый #990066 153 0 102
    Fuchsia Фуксия #FF00FF 255 0 255
    Gold Золотой #FFD700 250 215 0
    Gray Серый #808080 128 128 128
    Green Зелёный #00FF00 0 255 0
    Indigo Индиго #4B0082 75 0 130
    Jade Нефритовый #00A86B 0 168 107
    Lime Лайм #CCFF00 204 255 0
    Malachite Малахитовый #0BDA51 11 218 81
    Navy Тёмно-синий #000080 0 0 128
    Ochre Охра #CC7722 204 119 34
    Olive Оливковый #808000 128 128 0
    Orange Оранжевый #FFA500 255 165 0
    Peach Персиковый #FFE5B4 255 229 180
    Pumpkin Тыква #FF7518 255 117 24
    Purple Фиолетовый #800080 128 0 128
    Red Красный #FF0000 255 0 0
    Saffron Шафрановый #F4C430 244 196 48
    Sea Green Зелёное море #2E8B57 46 139 87
    Swamp green Болотный #ACB78E 172 183 142
    Teal Сине-зелёный #008080 0 128 128
    Ultramarine Ультрамариновый #120A8F 18 10 143
    Violet Фиолетовый #8B00FF 139 0 255
    Yellow Жёлтый #FFFF00 255 255 0

    Коды цветов (фон) по насыщенности и оттенку.

    Для задания цветов используются числа в шестнадцатеричном коде. Шестнадцатеричная система, в отличие от десятичной системы, базируется, как следует из её названия, на числе 16. Цифры будут следующие: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F. Цифры от 10 до 15 заменены латинскими буквами. Числа больше 15 в шестнадцатеричной системе образуются объединением двух чисел в одно. Например, числу 255 в десятичной системе соответствует число FF в шестнадцатеричной системе. Чтобы не возникало путаницы в определении системы счисления, перед шестнадцатеричным числом ставят символ решетки #, например #666999. Каждый из трех цветов - красный, зеленый и синий - может принимать значения от 00 до FF. Таким образом, обозначение цвета разбивается на три составляющие #rrggbb, где первые два символа отмечают красную компоненту цвета, два средних - зеленую, а два последних - синюю. Допускается использовать сокращенную форму вида #rgb, где каждый символ следует удваивать. Так, запись #fe0 следует расценивать как #ffee00.

    По названию

    Internet Explorer Chrome Opera Safari Firefox Android iOS
    4.0+ 1.0+ 3.5+ 1.3+ 1.0+ 1.0+ 1.0+

    Браузеры поддерживают некоторые цвета по их названию. В табл. 1 приведены названия, шестнадцатеричный код, значения в формате RGB, HSL и описание.

    Табл. 1. Названия цветов
    Имя Цвет Код RGB HSL Описание
    white #ffffff или #fff rgb(255,255,255) hsl(0,0%,100%) Белый
    silver #c0c0c0 rgb(192,192,192) hsl(0,0%,75%) Серый
    gray #808080 rgb(128,128,128) hsl(0,0%,50%) Темно-серый
    black #000000 или #000 rgb(0,0,0) hsl(0,0%,0%) Черный
    maroon #800000 rgb(128,0,0) hsl(0,100%,25%) Темно-красный
    red #ff0000 или #f00 rgb(255,0,0) hsl(0,100%,50%) Красный
    orange #ffa500 rgb(255,165,0) hsl(38.8,100%,50%) Оранжевый
    yellow #ffff00 или #ff0 rgb(255,255,0) hsl(60,100%,50%) Желтый
    olive #808000 rgb(128,128,0) hsl(60,100%,25%) Оливковый
    lime #00ff00 или #0f0 rgb(0,255,0) hsl(120,100%,50%) Светло-зеленый
    green #008000 rgb(0,128,0) hsl(120,100%,25%) Зеленый
    aqua #00ffff или #0ff rgb(0,255,255) hsl(180,100%,50%) Голубой
    blue #0000ff или #00f rgb(0,0,255) hsl(240,100%,50%) Синий
    navy #000080 rgb(0,0,128) hsl(240,100%,25%) Темно-синий
    teal #008080 rgb(0,128,128) hsl(180,100%,25%) Сине-зеленый
    fuchsia #ff00ff или #f0f rgb(255,0,255) hsl(300,100%,50%) Розовый
    purple #800080 rgb(128,0,128) hsl(300,100%,25%) Фиолетовый

    С помощью RGB

    Internet Explorer Chrome Opera Safari Firefox Android iOS
    5.0+ 1.0+ 3.5+ 1.3+ 1.0+ 1.0+ 1.0+

    Можно определить цвет, используя значения красной, зеленой и синей составляющей в десятичном исчислении. Каждая из трех компонент цвета принимает значение от 0 до 255. Также допустимо задавать цвет в процентном отношении, при этом 100% будет соответствовать числу 255. Вначале указывается ключевое слово rgb , а затем в скобках, через запятую указываются компоненты цвета, например rgb(255, 128, 128) или rgb(100%, 50%, 50%).

    RGBA

    Internet Explorer Chrome Opera Safari Firefox Android iOS
    9.0+ 1.0+ 10.0+ 3.1+ 3.0+ 2.1+ 2.0+

    Формат RGBA похож по синтаксису на RGB, но включает в себя альфа-канал, задающий прозрачность элемента. Значение 0 соответствует полной прозрачности, 1 — непрозрачности, а промежуточное значение вроде 0.5 — полупрозрачности.

    RGBA добавлен в CSS3, поэтому валидацию CSS-кода надо проводить именно по этой версии. Следует отметить, что стандарт CSS3 еще находится в разработке и некоторые возможности в нем могут поменяться. К примеру, цвет в формате RGB добавленный к свойству background-color проходит валидацию, а добавленный к свойству background уже нет. При этом браузеры вполне корректно понимают цвет для того и другого свойства.

    HSL

    Internet Explorer Chrome Opera Safari Firefox Android iOS
    9.0+ 1.0+ 9.6+ 3.1+ 3.0+ 2.1+ 2.0+

    Название формата HSL образовано от сочетания первых букв Hue (оттенок), Saturate (насыщенность) и Lightness (светлота). Оттенок это значение цвета на цветовом круге (рис. 1) и задаётся в градусах. 0° соответствует красному цвету, 120° - зелёному, а 240° - синему. Значение оттенка может изменяться от 0 до 359.

    Рис. 1. Цветовой круг

    Насыщенностью называется интенсивность цвета, измеряется в процентах от 0% до 100%. Значение 0% обозначает отсутствие цвета и оттенок серого, 100% максимальное значение насыщенности.

    Светлота задает, насколько цвет яркий и указывается в процентах от 0% до 100%. Малые значения делают цвет темнее, а высокие светлее, крайние значения 0% и 100% соответствуют чёрному и белому цвету.

    HSLA

    Internet Explorer Chrome Opera Safari Firefox Android iOS
    9.0+ 1.0+ 10.0+ 3.1+ 3.0+ 2.1+ 2.0+

    Формат HSLA похож по синтаксису на HSL, но включает в себя альфа-канал, задающий прозрачность элемента. Значение 0 соответствует полной прозрачности, 1 — непрозрачности, а промежуточное значение вроде 0.5 — полупрозрачности.

    Значения цвета в форматах RGBA, HSL и HSLA добавлены в CSS3, поэтому при использовании этих форматов проверяйте код на валидность с учётом версии.

    HTML5 CSS2.1 CSS3 IE Cr Op Sa Fx

    Цвета

    Предупреждение

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

    Арррргх!

    Результат данного примера показан на рис. 2.

    Рис. 2. Цвета на веб-странице