HSV (цветовая модель)

Материал из Википедии — свободной энциклопедии
Перейти к: навигация, поиск

HSV (англ. Hue, Saturation, Valueтон, насыщенность, значение) или 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 — радиус-вектором, а VZ-координатой. То есть, оттенок изменяется при движении вдоль окружности цилиндра, насыщенность — вдоль радиуса, а яркость — вдоль высоты. Несмотря на «математическую» точность, у такой модели есть существенный недостаток: на практике количество различимых глазом уровней насыщенности и оттенков уменьшается при приближении яркости (V) к нулю (то есть, на оттенках, близких к чёрному). Также на малых S и V появляются существенные ошибки округления при переводе RGB в HSV и наоборот. Поэтому чаще применяется коническая модель.

Конус[править | править вики-текст]

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

Другой способ визуализации цветового пространства — конус. Как и в цилиндре, оттенок изменяется по окружности конуса. Насыщенность цвета возрастает с отдалением от оси конуса, а яркость — с приближением к его основанию. Иногда вместо конуса используется шестиугольная правильная пирамида.


Оба этих способа являются удобной трёхмерной иллюстрацией пространства HSV. Но из-за трёхмерности они в прикладном ПО не применяются.

Визуализация HSV в прикладном ПО[править | править вики-текст]

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

Цветовой круг[править | править вики-текст]

Цветовой круг в прикладном ПО

Эта визуализация состоит из цветового круга (то есть, поперечного сечения цилиндра) и движка яркости (высоты цилиндра). Эта визуализация получила широкую известность по первым версиям ПО компании 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}
\\
\\
\end{cases} 0, если  MAX = 0;
1 - \dfrac{MIN}{MAX}, иначе

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 R G B
0 V V_{inc} V_{min}
1 V_{dec} V V_{min}
2 V_{min} V V_{inc}
3 V_{min} V_{dec} V
4 V_{inc} V_{min} V
5 V V_{min} 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

См. также[править | править вики-текст]