CSS function oklch

Опис

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

Oklch включає три основні компоненти кольору. Компонента lightness представляє яскравість кольору, chroma визначає насиченість, а hue вказує на тон кольору. При потребі можна також задати прозорість за допомогою параметра alpha.

Наприклад, використання функції oklch(50%, 40, 180deg) встановить колір зі середньою яскравістю, помірною насиченістю та відтінком 180 градусів в просторі кольорів Oklch. Цей приклад демонструє відтінок блакитного кольору зі збалансованою яскравістю та насиченістю.

Приклади значень:

oklch(50%, 0, 0deg): середня яскравість, без насиченості, червоний колір.
oklch(80%, 70, 240deg): висока яскравість, висока насиченість, синій колір.
oklch(30%, 50, 120deg, 0.5): низька яскравість, помірна насиченість, зелений колір з полупрозорістю.

автор: Bond

Нотатка: Використовуйте функцію oklch() для отримання кольорів в просторі Oklch, який забезпечує більш однорідну та передбачувану яскравість у порівнянні з RGB або HSL.
автор: Bond
Нотатка: Зверніть увагу, що простір кольорів Oklch базується на моделі Oklab, яка працює у деяких браузерах, але не підтримується в усіх. Перед використанням переконайтесь, що цей простір кольорів підтримується вашою цільовою аудиторією.
автор: Bond
Нотатка: Експериментуйте зі значеннями окомпоненти, сили та відтінку, щоб створити бажані кольори в просторі Oklch.
автор: Bond

Синтаксис

oklch(<lightness>, <chroma>, <hue>, <alpha>);

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

<lightness>

Числове значення в діапазоні від 0% до 100% (наприклад, 50%).

автор: Bond

<chroma>

Числове значення без одиниць, зазвичай від 0 до 100, але може бути більшим. Вищі значення дадуть більш насичені кольори.

автор: Bond

<hue>

Числове значення з одиницями виміру кута, такими як градуси (deg) або радіани (rad). Зазвичай використовуються значення від 0 до 360 градусів, де 0 відповідає червоному коліру, 120 - зеленому, 240 - синьому.

автор: Bond

<alpha>