На жаль, смакові відчуття на сайті відобразити поки що неможливо. Але це можна сповна компенсувати за допомогою колірної гами. Адже кольори 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 цей інструмент реалізований трохи інакше:
Насиченість кожного кольору в генераторі визначається за допомогою спеціальних повзунків. Відтінок візуально відображається кольором рамки та прямокутника з лівого боку. Внизу в трьох полях відображається колірний код в основних форматах.
Але генератор кольорів доступний не лише на спеціалізованих сайтах. Подібним інструментом забезпечені майже всі графічні редактори. Наприклад, Photoshop :
Техніка безпеки під час роботи з кольором
А було це давно, ще в епоху відеокарт, що підтримують лише 256 кольорів. У ті далекі часи Операційні системимогли без спотворень відображати лише певну кількість восьми бітових відтінків.
Тоді було виведено велику таблицю безпечних кольорів. В ній вказувалося 216 відтінків, які могли бути відображені без спотворення будь-якого з браузерів того часу. І до цього дня ця « великий рукопис» ще доступна на деяких ресурсах:
Нині все змінилося. Тому всі правила техніки безпеки під час роботи з кольором у html повністю анулюються. Адже сучасне комп'ютерне залізо підтримує понад 16 мільйонів різних відтінків. І 216 безпечних квітів канули в лету. 26.02.15 8.9K
Як відомо, колір може впливати на стан людини: як психічний, так і фізичний. Щодня, переглядаючи сайти в інтернеті, очі оцінюють мільйони кольорів та відтінків. Веб-дизайнер, який ознайомлений із психологією кольору, може керувати настроєм відвідувача для досягнення будь-яких цілей.
Це пов'язано з тим, деякі відтінки заспокоюють, а деякі навпаки – збуджують. Далі йтиметься про те, як синтезується і відображається колір за допомогою комп'ютерної техніки.
RGB – це колірна модель, що представляє метод отримання всіх кольорів та їх відтінків шляхом змішування у різних пропорціях трьох головних компонентів, якими є:
- червоний колір ( Red);
- зелений колір ( Green);
- синій колір ( Blue).
Звідси і походить скорочена назва RGB. Дані кольору неспроста обрані основними: причиною є фізіологія сітківки людського ока, і те, як вона сприймає їх:
RGB-модель на сьогоднішній день залишається найпопулярнішою та застосовується для відтворення кольорів на екранах телевізорів та комп'ютерних моніторах. Тому що виробники наділяють свої вироби різними характеристиками, у 1996 була створена єдина система синтезу кольорів на основі RGB під назвою sRGB , над якою спільно попрацювали компанії Microsoft та HP .
Числове уявлення кольору
Як було сказано раніше, RGB кольори формуються шляхом змішування основних. Для опису інтенсивності кожного їх прийняли схему, у якій колір представляється діапазоном 0-255 (8 біт ), що у шістнадцятковій системі обчислення відповідає 00-FF .
Тобто, основні кольори матимуть такий вигляд:
- Червоний - RGB (255,0,0);
- Зелений - RGB (0,255,0);
- Синій - RGB (0,0,255);
Якщо ж інтенсивність кольору набуває значення менше 255, то виходять різні відтінки червоного, зеленого та синього. Далі наведено таблицю їх градації, а також представлені шістнадцяткові значення кожного з відтінків:
Таблиці кольорів RGB
Звичайно, крім градацій основних кольорів, існують змішані, і їх кількість досить велика. Тому була створена таблиця RGB-квітів, в якій представлені всі існуючі відтінки, а також наведені їх назви та числові уявлення ( у десятковій та шістнадцятковій формі).
Ознайомитись з нею можна тут. Ця таблиця дуже полегшує життя веб-дизайнерам, оскільки за кілька секунд можна знайти необхідний відтінок і дізнатися його числове уявлення.
Безпечна палітра RGB кольорів
Однак у якийсь момент існувала проблема відображення кольорів у різних браузерах, і для її вирішення була скомпонована так звана "безпечна" палітра RGB кольорів, які були виведені математичними обчисленнями.
Коли браузер не може коректно відобразити колір, він намагається отримати близький до необхідного шляхом змішування сусідніх кольорів, і швидше за все результат буде абсолютно неприйнятним:
Використовуючи коди кольорів RGB з даної панелі, веб-розробник може не боятися за відображення кольорів на сторінках свого сайту під час перегляду за допомогою різних браузерів, різних платформ і моніторів. Хоча на Наразітаблиця безпечних кольорів втрачає свою актуальність ( технічний прогресвсе ж таки не стоїть на місці), при її використанні можна, як то кажуть, спати спокійно.
Золотий колір в моделі RGB
Вперше слово «золотий» було використано в початку XIVстоліття для опису кольору хімічного елементапід назвою Aurum – золото. У моделі RGB золотий колір представлений такими числовими значеннями:
- RGB (255, 215, 0) - десятирічна система;
- HEX #FFD700 – шістнадцяткова система.
Бежевий колір у RGB моделі
Бежевий колір займає досить значуще місцев історії, нехай він і не найвиразніший. Багато пам'яток культури, особливо античні скульптури, були виготовлені зі стеатиту і мильного каменю, що мають бежевий відтінок. У моделі 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. |
У цьому випадку колір визначається трьома шістнадцятковими числами, кожне з яких складається з двох цифр. Перше число визначає інтенсивність червоногокольору, середнє- зеленого, останнє- синьогокольори. Всі числа можуть набувати значення в діапазоні від 00 до FF(Від 0 до 255). Наприклад: зелений колір задається як #00FF00, червоний - як #FF0000, синій - як #0000FF, білий - як #FFFFFF, повна відсутність кольору або чорний задається як #000000 .
У нижченаведеній формі Ви зможете задати будь-які шістнадцяткові значення кожного з трьох кольорів і подивитися результат їх змішування, клікнувши в полі виведення.
Приклади деяких шістнадцяткових значень кольорів 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 | Darkoliegreen | 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 |
У 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 | |
Коди кольорів (фон) за насиченістю та відтінком.