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

CSS function hwb()

Опис

Функція hwb() в CSS представляє собою потужний інструмент для управління кольорами, заснований на комбінації трьох основних компонентів: тону (Hue), білості (Whiteness) та чорноти (Blackness). Ця методологія дає змогу створювати чіткі, відповідні кольорові схеми та дозволяє детально керувати виглядом елементів на веб-сайті.

Кожна компонента в hwb() має своє визначення та вплив на кінцевий колір: тон вказує кольоровий відтінок, насиченість контролює насиченість кольору, а яскравість впливає на його яскравість. Наприклад, використання hwb(180, 50%, 20%) встановить колір з тоном 180 градусів (синій відтінок), насиченістю 50% та яскравістю 20%. Такий підхід дає можливість створювати точні та живі кольори, які відповідають потребам дизайну.

Функція hwb() приймає три аргументи:

  • Значення тону (в градусах): вказує кольоровий відтінок, від 0 до 360.
  • Значення насиченості (відсотки): контролює насиченість кольору, від 0 до 100%.
  • Значення яскравості (відсотки): впливає на яскравість кольору, від 0 до 100%.
Нотатка:

Функція hwb() є важливим інструментом для розробників та дизайнерів, які хочуть створювати сучасні та привабливі веб-сайти. Вона пропонує гнучкість та точність у виборі кольорів, що робить її корисним доповненням до арсеналу кожного спеціаліста у сфері веб-дизайну.
Порада:

Використовуйте hwb() для визначення кольорів у просторі HWB, що дозволяє вам контролювати відтінок, присутність білого та чорного окремо.
Нотатка:

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

Синтаксис

hwb(hue, whiteness, blackness);
<hue>

Числове значення від 0 до 360, що визначає відтінок кольору. У deg, turn або тільки числове значення.

<whiteness>

Числове значення від 0% до 100%, що визначає присутність білого кольору.

<blackness>

Числове значення від 0% до 100%, що визначає присутність чорного кольору.

Переглядачі

Переглядач

101

96

15

87

101
Переглядач

101

101

96

15

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

Приклади


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

Кожен квадрат має заданий фоновий колір за допомогою hwb().

Спільнота

Зв'язок