CSS function hwb


Опис

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

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

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

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

Порада

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

автор: Bond
Нотатка

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

автор: Bond
Нотатка

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

автор: Bond

Синтаксис

hwb(hue, whiteness, blackness);

Функція hwb може отримувати 3 значень:

<hue>

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

автор: Bond

<whiteness>

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

автор: Bond

<blackness>

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

автор: Bond

Переглядачі

Підтримка: стаціонарні переглядачі
Переглядач Google Chrome Mozilla Firefox Apple Safari Opera Microsoft EDGE
101 96 15 87 101
Підтримка: мобільні переглядачі
Переглядач Mobile Google Android Mobile Google Chrome Mobile Mozilla Firefox Mobile Apple Safari
101 101 96 15

Приклади

+ запропонувати свій приклад у пісочниці

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

автор: Bond

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

автор: Bond

Коментарі

Коментарів ще немає — будьте першим!

Відповідь для

Увійдіть — коментар з'явиться одразу, без капчі й очікування перевірки.

Пропозиція правки

Ваша версія — : після перевірки замінить чинну. Нова порада чи нотатка — з'явиться на сторінці після перевірки.

Ви гість — діють добові ліміти. Увійдіть, щоб пропонувати без капчі.

Ваша версія секції «»: після перевірки замінить чинну.

Ви гість — діють добові ліміти. Увійдіть, щоб пропонувати без капчі.

Ваша версія опису «»: після перевірки замінить чинну.

Ви гість — діють добові ліміти. Увійдіть, щоб пропонувати без капчі.

Зворотний зв'язок
Вхід