css.in.ua
Підтримати

CSS function lab()

Опис

Функція lab() в CSS є інструментом для визначення кольорів за допомогою специфічного методу, заснованого на трьох параметрах: яскравість (lightness), кольоровий компонент a та кольоровий компонент b. Він відкриває можливість для детального управління кольоровими характеристиками, включаючи відтінок та колірні властивості.

Ця функція є частиною сучасних специфікацій CSS і використовується дизайнерами і розробниками для створення різноманітних кольорових схем. Наприклад, ви можете використовувати функцію lab(50%, 20, -30), щоб отримати кольорове значення зі значеннями яскравості 50%, кольорового компонента a 20 та кольорового компонента b -30.

Ось невеликий приклад використання функції lab() в CSS:

.element {
  color: lab(70%, 10, 5);
  background-color: lab(50%, 30, -10);
}

У цьому прикладі, елемент з класом .element матиме текстовий колір, визначений за допомогою функції lab(70%, 10, 5), і фоновий колір, визначений за допомогою функції lab(50%, 30, -10). Це надає можливість гнучкого управління кольором, забезпечуючи точне відображення відтінків і насиченості кольору в вашому веб-дизайні.

Порада:

Використовуйте функцію lab() для створення кольорових палітр з визначеними значеннями яскравості та кольорових компонентів. Вона може бути особливо корисною, коли вам потрібно працювати з кольорами у просторі LAB.
Нотатка:

Зверніть увагу, що значення яскравості (l) впливає на світлоту або темноту кольору, значення кольорового компонента a визначає відтінок між зеленим та червоним, а значення кольорового компонента b визначає відтінок між жовтим та синім.
Нотатка:

Функція lab() може бути використана разом з іншими CSS властивостями та функціями для досягнення більш точного контролю кольорів у вашому веб-дизайні.

Синтаксис

lab(<l>, <a>, <b>);
<l>

Число від 0 до 100%, яке вказує на яскравість (lightness) кольору.

<a>

Число, яке визначає кольоровий компонент a, зазвичай в діапазоні від -128 до 127.

<b>

Число, яке визначає кольоровий компонент b, зазвичай в діапазоні від -128 до 127.

Переглядачі

Переглядач

111

113

15

97

111
Переглядач

111

111

113

15

Мобільних переглядачів ще не додано.

Приклади


Наведіть курсор на елемент, щоб побачити зміну кольору.

Другий елемент має фоновий колір, визначений за допомогою функції lab().

Документи

Зв'язок