Небесний колір код. Колір у стилях можна задавати різними способами: за шістнадцятковим значенням, за назвою, у форматі RGB, RGBA, HSL, HSLA


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

Кольори та коди форматування

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

Дуже легко відформатувати текст у конфігах або в грі, використовуючи таблицю кольорів нижче. &r використовується скидання всіх кодів, тобто. &mААА&rБББ відображатиметься як ААА БББ.

Представляємо таблицю існуючих колірних кодівв Майнкрафт для вашої зручності:

КодНазваТех. НазваКолір символуКолір тіні символ
RGBHexRGBHex
&0 Чорнийblack0 0 0 000000 0 0 0 000000
&1 Темно синійdark_blue0 0 170 0000AA0 0 42 00002A
&2 Темно-зеленийdark_green0 170 0 00AA000 42 0 002A00
&3 Темно-синьо-зеленийdark_aqua0 170 170 00AAAA0 42 42 002A2A
&4 Темно червонийdark_red170 0 0 AA000042 0 0 2A0000
&5 Темно фіолетовийdark_purple170 0 170 AA00AA42 0 42 2A002A
&6 Золотийgold255 170 0 FFAA0042 42 0 2A2A00
&7 Сірийgray170 170 170 AAAAAA42 42 42 2A2A2A
&8 Темно-сірийdark_gray85 85 85 555555 21 21 21 151515
&9 Блакитнийblue85 85 255 5555FF21 21 63 15153F
&aЗеленийgreen85 255 85 55FF5521 63 21 153F15
&bСиньо-зеленийaqua85 255 255 55FFFF21 63 63 153F3F
&cчервонийred255 85 85 FF555563 21 21 3F1515
&dСвітлофіолетовийlight_purple255 85 255 FF55FF63 21 63 3F153F
&eЖовтийyellow255 255 85 FFFF5563 63 21 3F3F15
&fБілийwhite255 255 255 FFFFFF63 63 63 3F3F3F

Іноді буває потрібно підкреслити, закреслити, виділитибудь-який текст. Для цього використовується форматування тексту. Використовується так само як і кольори (перед текстом ставимо коднаприклад &lMinecraft = Minecraft.

Для зручності нижче наведена таблиця кодів для форматування:

КодНазва
&kМагічний текст
&lЖирний текст
&mЗакреслений текст
&nПідкреслений текст
&oКурсивний текст
&rТекст без форматування
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 безпечних квітів канули в лету.

Для завдання кольорів використовуються числа у шістнадцятковому коді. Шістнадцяткова система, на відміну від десяткової системи, базується, як випливає з її назви, на числі 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. Кольори на веб-сторінці

Коди кольорів 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

Влад Мержевич

У HTML колір задається одним із двох шляхів: за допомогою шістнадцяткового коду і за назвою деяких кольорів. Переважно використовується спосіб, заснований на шістнадцятковій системі числення, як найбільш універсальний.

Шістнадцяткові кольори

Для завдання кольорів HTML використовуються числа в шістнадцятковому коді. Шістнадцяткова система, на відміну від десяткової системи, базується, як випливає з її назви, на числі 16. Цифри будуть наступні: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C , D, E, F. Числа від 10 до 15 замінені латинськими літерами. У табл. 6.1 наведено відповідність десяткових та шістнадцяткових чисел.

Числа більше 15 у шістнадцятковій системі утворюються об'єднанням двох чисел в одне (табл. 6.2). Наприклад, числу 255 у десятковій системі відповідає число FF у шістнадцятковій.

Щоб не виникало плутанини у визначенні системи числення, перед шістнадцятковим числом ставиться символ ґрат #, наприклад #aa69cc. У цьому регістр значення немає, тому допустимо писати #F0F0F0 чи #f0f0f0.

Типовий колір, що використовується в HTML, виглядає так.

Тут колір фону веб-сторінки встановлено як #FA8E47. Символ грат # перед числом означає, що воно шістнадцяткове. Перші дві цифри (FA) визначають червону складову кольору, цифри третьої по четверту (8E) — зелену, а останні дві цифри (47) — синю. У результаті вийде такий колір.

FA + 8E + 47 = FA8E47

Кожен із трьох кольорів — червоний, зелений та синій — може набувати значень від 00 до FF, що у результаті утворює 256 відтінків. Таким чином, загальна кількість кольорів може бути 256х256х256 = 16777216 комбінацій. Колірна модель, заснована на червоній, зеленій та синій складовій, отримала назву RGB (red, green, blue; червоний, зелений, синій). Ця модель адитивна (від add - складати), при якій додавання всіх трьох компонентів утворює білий колір.

Щоб легше орієнтуватися в шістнадцяткових кольорах, зважте на деякі правила.

  • Якщо значення компонента кольору однакові (наприклад: #D6D6D6), то вийде сірий відтінок. Чим більша кількість, тим світліший колір, значення змінюються від #000000 (чорний) до #FFFFFF (білий).
  • Яскраво-червоний колір утворюється, якщо червоний компонент зробити максимальним (FF), а решту компонентів обнулити. Колір зі значенням #FF0000 найчервоніший із можливих червоних відтінків. Аналогічно з зеленим кольором(#00FF00) та синім (#0000FF).
  • Жовтий колір(#FFFF00) виходить змішанням червоного із зеленим. Це добре видно на колірному колі (рис. 6.1), де представлені основні кольори (червоний, зелений, синій) та комплементарні чи додаткові. До них відносяться жовтий, блакитний та фіолетовий (ще званим пурпурним). Взагалі, будь-який колір можна отримати змішанням довколишніх кольорів. Так, блакитний (#00FFFF) виходить за рахунок поєднання синього та зеленого кольору.

Мал. 6.1. Колірний круг

Кольори за шістнадцятковими значеннями не обов'язково підбирати емпіричним шляхом. Для цієї мети підійде графічний редактор, який вміє працювати з різними моделями кольорів, наприклад, Adobe Photoshop. На рис. 6.2 показано вікно вибору кольору в цій програмі, лінією обведено отримане шістнадцяткове значення поточного кольору. Його можна скопіювати та вставити до себе в код.

Мал. 6.2. Вікно для вибору кольору в програмі Photoshop

Веб-кольори

Якщо встановити якість кольору монітора в 8 біт (256 кольорів), то один і той же колір може відображатися в різних браузерах по-своєму. Це пов'язано зі способом відображення графіки, коли браузер працює зі своєю власною палітрою і не може показати колір, який у панелі немає. У цьому випадку колір замінюється поєднанням пікселів інших, близьких до нього, кольорів, що імітують заданий. Щоб колір залишався незмінним у різних браузерах, ввели палітру про веб-квітів. Веб-квітами називаються такі кольори, для кожної складової яких - червоної, зеленої та синьої - встановлюється одне з шести значень - 0 (00), 51 (33), 102 (66), 153 (99), 204 (CC), 255 (FF). У дужках зазначено шістнадцяткове значення цієї компоненти. Загальна кількість кольорів із усіх можливих поєднань дає 6х6х6 – 216 кольорів. Приклад веб-кольору - #33FF66.

Основна особливість веб-кольору полягає в тому, що він відображається однаково у всіх браузерах. В даний момент актуальність веб-квітів дуже мала через підвищення якості моніторів та розширення їх можливостей.

Кольори за назвою

Щоб не запам'ятовувати сукупність цифр, замість них можна використовувати імена кольорів, що широко використовуються. У табл. 6.3 наведено імена найпопулярніших назв кольорів.

Табл. 6.3. Назви деяких кольорів
Ім'я кольору Колір Опис Шістнадцяткове значення
black Чорний #000000
blue Синій #0000FF
fuchsia Світлофіолетовий #FF00FF
gray Темно-сірий #808080
green Зелений #008000
lime Світло зелений #00FF00
maroon Темно червоний #800000
navy Темно синій #000080
olive Оливковий #808000
purple Темно фіолетовий #800080
red червоний #FF0000
silver Світло сірий #C0C0C0
teal Синьо-зелений #008080
white Білий #FFFFFF
yellow Жовтий #FFFF00

Не має значення, яким способом ви задаєте колір - на його ім'я або за допомогою шістнадцяткових чисел. По дії ці способи рівні. У прикладі 6.1 показано, як встановити колір тла та тексту веб-сторінки.

Приклад 6.1. Колір фону та тексту

кольори

Приклад тексту



У даному прикладіколір фону задається за допомогою атрибуту bgcolor тега а колір тексту через атрибут text . Для різноманітності значення атрибута text встановлено у вигляді шістнадцяткового числа, а у bgcolor за допомогою зарезервованого ключового слова teal .