HSB

Матеріал з Вікіпедії — вільної енциклопедії.
Перейти до: навігація, пошук

HSB — колірна модель, що використовується тільки для оформлення векторних і текстових об'єктів документа. Описує кольоровий простір, заснований на трьох характеристиках кольору: кольоровому тоні (Hue), насиченості (Saturation) і яскравості (Brightness).

Шкала відтінків — Hue
  • Hue — колірний тон, (наприклад, червоний, зелений або синьо-блакитний). Варіюється в межах 0-360°, але іноді приводиться до діапазону 0-100 або 0-1. У Windows весь колірний спектр ділиться на 240 відтінків (що можна спостерігати в редакторі палітри MS Paint), тобто тут «Hue» приводиться до діапазону 0-240 (відтінок 240 відсутній, так як він дублював би 0).
  • Saturation — насиченість. Варіюється в межах 0-100 або 0-1. Чим більше цей параметр, тим «чистіше» колір, тому цей параметр іноді називають чистотою кольору. А чим ближче цей параметр до нуля, тим ближче колір до нейтрального сірого.
  • Value (значення кольору) або Brightness — яскравість. Також задається в межах 0-100 або 0-1.

Модель була створена Елві Реєм Смітом, одним із засновників Pixar, в 1978 році. Вона є нелінійним перетворенням моделі RGB.

Колір, представлений в HSV, залежить від пристрою, на яке він буде виведений, так як HSV — перетворення моделі RGB, яка теж залежить від пристрою. Для отримання коду кольору, не залежного від пристрою, використовується модель Lab.

Слід зазначити, що HSV (HSB) і HSL — дві різні колірні моделі.

Тривимірні візуалізації простору HSV[ред.ред. код]

Циліндр[ред.ред. код]

Циліндр
HSV cyclinder.gif

Найпростіший спосіб відобразити HSV в тривимірний простір — скористатися циліндричною системою координат. Тут координата H визначається полярним кутом, S — радіус-вектором, а V — Z-координатою. Тобто, відтінок змінюється при русі вздовж кола циліндра, насиченість — вздовж радіуса, а яскравість — вздовж висоти. Незважаючи на математичну точність, у такої моделі є істотний недолік: на практиці кількість помітних оком рівнів насиченості і відтінків зменшується при наближенні яскравості (V) до нуля (тобто, на відтінках, близьких до чорного). Також на малих S і V з'являються суттєві помилки округлення при перекладі RGB в HSV і навпаки. Тому частіше застосовується конічна модель.

Конус[ред.ред. код]

Канонічне представлення моделі
HSV cone.gif

Інший спосіб візуалізації колірного простору — конус. Як і в циліндрі, відтінок змінюється по колу конуса. Насиченість кольору зростає з віддаленням від Вісь конуса, а яскравість — з наближенням до його основи. Іноді замість конуса використовується шестикутна правильна піраміда.

Обидва ці способи є зручною тривимірної ілюстрацією простору HSV. Але через тривимірність вони в прикладному ПО не застосовуються.

Візуалізація HSV в прикладному ПК[ред.ред. код]

Модель HSV часто використовується в програмах комп'ютерної графіки, так як зручна для людини. Нижче вказані способи «розгортання» тривимірного простору HSV на двомірний екран комп'ютера.

Колірне коло[ред.ред. код]

Файл:HSV-Slider.png
Колірне коло в прикладному ПК

Ця візуалізація складається з колірного кола (тобто, поперечного перерізу циліндра) і двигуна яскравості (висоти циліндра). Ця візуалізація отримала широку популярність у перших версіях ПК компанії Corel. На даний момент застосовується надзвичайно рідко, частіше використовують кільцева модель («а-ля Macromedia»)

Кольорове кільце[ред.ред. код]

Кольорове кільце з осями H, S і V
кільце

Відтінок представляється у вигляді райдужного кільця, а насиченість і значення кольору вибираються за допомогою вписаного в це кільце трикутника. Його вертикальна вісь, як правило, регулює насиченість, а горизонтальна дозволяє змінювати значення кольору. Таким чином, для вибору кольору потрібно спочатку вказати відтінок, а потім вибрати потрібний колір з трикутника.

Зміна одного компонента[ред.ред. код]

Три рівня яскравості при незмінній насиченості
Три рівня насиченості при незмінній яскравості

На цих двох діаграмах показуються кольори, які розрізняються тільки однією компонентою.

Матриця сусідніх відтінків[ред.ред. код]

3 × 3 × 3

Різниця близьких кольорів можна відобразити іншим шляхом — показати поруч кілька кольорів, які не сильно відрізняються своїми компонентами. На малюнку праворуч показано 27 близьких відтінків оранжевого, відсортованих по яскравості і розташовуються по спіралі. Квадратики в центрі показують ті ж кольори, але відсортовані у більш лінійному порядку.

HSV і сприйняття кольору[ред.ред. код]

Зображення та його окремі компоненти — H , S , V. На різних ділянках зображення можна простежити зміну компонент

Часто художники вважають за краще використовувати HSV замість інших моделей, таких як RGB і CMYK, тому що вони вважають, що пристрій HSV ближче до людського сприйняття кольорів. RGB і CMYK визначають колір як комбінацію основних кольорів ( червоного, зеленого і синього або жовтого, пурпурного, блакитного і чорного відповідно), в той час як компоненти кольору в HSV відображають інформацію про колір у більш звичній людині формі : Що це за колір? Наскільки він насичений ? Наскільки він світлий чи темний? Кольорова палітра HSL представляє колір схожим і навіть, можливо, більш інтуїтивно зрозумілим чином, ніж HSV.


Перетворення колірних компонентів між моделями[ред.ред. код]

RGB → HSV[ред.ред. код]

Ілюстрація, що демонструє відношення між RGB і HSV

Вважаємо, що:


\begin{align}
  H & \in \left[ 0, 360 \right) \\
  S,V,R,G,B & \in \left[ 0, 1 \right]
\end{align}

Нехай MAX  — максимальне значення з R, G і B, а MIN — мінімальне з них.

H = 
\begin{cases}
\\
\end{cases}  0, якщо MAX = MIN
60 \times \frac{G - B}{MAX - MIN} + 0, якщо MAX = R~ і G \ge B
60 \times \frac{G - B}{MAX - MIN} + 360, якщо MAX = R~ і G < B~
60 \times \frac{B - R}{MAX - MIN} + 120, якщо MAX = G~
60 \times \frac{R - G}{MAX - MIN} + 240, якщо MAX = B~

S = 
\begin{cases}
0,& \text{if } MAX = 0;\\
1 - \dfrac{MIN}{MAX},& \text{otherwise}
\end{cases}

V = MAX \,

HSV → RGB[ред.ред. код]

Для будь-яких відтінків H ∈ [0°,360°), насиченості S ∈ [0, 100], і яскравості V ∈[0, 100]:

H_i = \left\lfloor {H \over 60} \right\rfloor
V_{min} = {{(100 - S) * V} \over 100}
a = {(V -V_{min})} *{{H \mod 60} \over 60}
V_{inc} = V_{min} + a
V_{dec} = V - a
  • якщо H_i = 0, то R = V, G = V_{inc}, B = V_{min}
  • якщо H_i = 1, то R = V_{dec}, G = V, B = V_{min}
  • якщо H_i = 2, то R = V_{min}, G = V, B = V_{inc}
  • якщо H_i = 3, то R = V_{min}, G = V_{dec}, B = V
  • якщо H_i = 4, то R = V_{inc}, G = V_{min}, B = V
  • якщо H_i = 5, то R = V, G = V_{min}, B = V_{dec}

Отримані значення червоного, зеленого і синього каналів RGB обчислюються у відсотках. Щоб привести їх у відповідність поширеному уявленню COLORREF необхідно помножити кожне з них на 2,55.

При цілочисельному кодуванні кожного кольору в HSV є відповідний колір в RGB. Однак зворотне твердження не є вірним: деякі кольору в RGB не можна виразити в HSV так, щоб значення кожного компонента було цілим. Фактично, при такому кодуванні доступна тільки \frac {1} {256} частина колірного простору RGB.


Додаткові кольори[ред.ред. код]

Два кольори називаються додатковими, якщо при змішуванні їх в рівній пропорції виходить чистий сірий колір. Якщо заданий один колір (H, S,  V ), то обов'язково існує додатковий йому колір ( H ',  S ',  V' ). Оскільки результуючий колір повинен бути сірим, його насиченість (S) повинна дорівнювати 0. Таким чином,

H^\prime =  \begin{cases}H - 180, & \mbox{if } H \ge 180 \\H + 180, & \mbox{if } H < 180 \end{cases}
S^\prime = {VS \over V(S - 1) + 1}
V^\prime = V(S - 1) + 1