Стилізація Тексту та Кольорів

Раніше ми додавали кольори до тексту дуже інтуїтивно та просто. Однак давайте детальніше розглянемо, як застосовуються кольори.

Колір

Колір тексту можна задати для текстового елемента за допомогою CSS-властивості color, якій можна присвоїти значення у різних форматах.

Найчастіше використовуються значення кольорів у форматах RGB, hex та за назвами кольорів. Розглянемо наступний приклад, де до тексту застосовується синій колір.

Формати для задання кольору

Розглянемо кожен формат детальніше.

Назва кольору

Можна використовувати зарезервовані слова для кольорів. Список зарезервованих кольорів доступний за посиланням https://htmlcolorcodes.com.

CSS містить попередньо визначені назви кольорів, такі як blue, red, green, purple та інші. Вони легко читаються, але мають обмежений вибір.

Hex-формат

Hex представляє кольори у вигляді шестицифрового коду, що складається з трьох пар двозначних значень після символу #. Кожна пара відповідає інтенсивності червоного, зеленого та синього (саме в такому порядку).

Значення у шістнадцятковому форматі варіюються від 00 (відсутність інтенсивності) до FF (максимальна інтенсивність).

Формат RGB

RGB представляє кольори у вигляді трьох чисел, що відповідають інтенсивності червоного, зеленого та синього (у такому порядку)

Значення у форматі RGB варіюються від 0 (відсутність інтенсивності) до 255 (максимальна інтенсивність).

Прозорість з RGBA

Прозорість у кольорах rgb можна досягти за допомогою нотації rgba (red, green, blue, alpha), де alpha — це рівень непрозорості або прозорості кольору.

Значення alpha може бути від 0 (повністю прозорий) до 1 (повністю непрозорий). Наприклад, значення RGBA rgba(0, 255, 0, 0.5) означає зелений колір з 50% прозорістю.