Русская Википедия:HSV (цветовая модель)

Материал из Онлайн справочника
Перейти к навигацииПерейти к поиску

Шаблон:Значения Шаблон:Много внутренних ссылок HSV (Шаблон:Lang-en — тон, насыщенность, значение) или HSB (Шаблон:Lang-en — тон, насыщенность, яркость) — цветовая модель, в которой координатами цвета являются:

Файл:HueScale.svg
Шкала оттенков — Hue
  • Hue — цветовой тон, (например, красный, зелёный или сине-голубой). Варьируется в пределах 0—360°, однако иногда приводится к диапазону 0—100 или 0—1.
  • Saturation — насыщенность. Варьируется в пределах 0—100 или 0—1. Чем больше этот параметр, тем «чище» цвет, поэтому этот параметр иногда называют чистотой цветаШаблон:Нет АИ. А чем ближе этот параметр к нулю, тем ближе цвет к нейтральному серому.
  • Value (значение цвета) или Brightness — яркость. Также задаётся в пределах 0—100 или 0—1.

Модель была создана Шаблон:Нп3, одним из будущих сооснователей Pixar, в середине 1970-х. Она является нелинейным преобразованием модели RGB.

Цвет, представленный в HSV, зависит от устройства, на которое он будет выведен, так как HSV — преобразование модели RGB, которая тоже зависит от устройства. Для получения кода цвета, не зависящего от устройства, используется модель Lab.

HSV (HSB) и HSL — две разные цветовые модели.

Трёхмерные визуализации пространства HSV

Цилиндр

Файл:HSV cylinder.png
Цилиндр
Файл:HSV cyclinder.gif

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

Конус

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

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

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

Визуализация HSV в прикладном ПО

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

Цветовой круг

Файл:HSV-Slider.png
Цветовой круг в прикладном ПО

Эта визуализация состоит из цветового круга (поперечного сечения цилиндра) и движка яркости (высоты цилиндра). Эта визуализация получила широкую известность по первым версиям ПО компании Corel. На данный момент применяется чрезвычайно редко, чаще используют кольцевую модель («а-ля Macromedia»)

Цветовое кольцо

Файл:Triangulo HSV.png
Цветовое кольцо с осями H, S и V
Файл:HSV clr wheel.gif
Поворачивающееся кольцо

Оттенок представляется в виде радужного кольца, а насыщенность и значение цвета выбираются при помощи вписанного в это кольцо треугольника. Его вертикальная ось, как правило, регулирует насыщенность, а горизонтальная позволяет изменять значение цвета. Таким образом, для выбора цвета нужно сначала указать оттенок, а потом выбрать нужный цвет из треугольника.

Изменение одного компонента

Файл:Hsv Saturation Chart.png
Три уровня яркости при неизменной насыщенности
Файл:Hsv Value Chart.png
Три уровня насыщенности при неизменной яркости

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

Матрица соседних оттенков

Файл:Hueborhood.png
3×3×3

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

HSV и восприятие цвета

Файл:Barns grand tetons HSV separation.jpg
Изображение и его отдельные компоненты — H, S, V. На разных участках изображения можно проследить изменения компонент

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

Преобразования цветовых компонентов между моделями

RGB → HSV

Файл:HSV-RGB-comparison.svg
Иллюстрация, демонстрирующая отношение между RGB и HSV
Файл:RGB 2 HSV conversion with grid.ogg
Визуализация перехода между цветовыми моделями RGB и HSV

Считаем, что:

<math>

\begin{align}

 H & \in \left[ 0, 360 \right] \\
 S,V,R,G,B & \in \left[ 0, 1 \right]

\end{align} </math>

Пусть <math>MAX</math> — максимальное значение из <math>R</math>, <math>G</math> и <math>B</math>, а <math>MIN</math> — минимальное из них.

<math>H =

\begin{cases} \\ \\ \\ \\ \\ \\ \\ \\ \end{cases}</math>

не определено, если <math>MAX = MIN</math>
<math>60 \times \frac{G - B}{MAX - MIN} + 0,</math> если <math>MAX = R</math> и <math>G \ge B</math>
<math>60 \times \frac{G - B}{MAX - MIN} + 360,</math> если <math>MAX = R</math> и <math>G < B</math>
<math>60 \times \frac{B - R}{MAX - MIN} + 120,</math> если <math>MAX = G</math>
<math>60 \times \frac{R - G}{MAX - MIN} + 240,</math> если <math>MAX = B</math>
<math>S =

\begin{cases} \\ \\ \end{cases}</math>

<math>0,</math> если <math> MAX = 0;</math>
<math>1 - \dfrac{MIN}{MAX},</math> иначе

<math>V = {MAX}</math>

HSV → RGB

Для любых оттенков <math>H \in \left[ 0, 360 \right]</math>, насыщенности <math>S \in \left[ 0, 100 \right]</math> и яркости <math>V \in \left[ 0, 100 \right]</math>:

<math> \begin{align} H_i & = \left\lfloor {H \over 60} \right\rfloor\mod 6 \\ 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 \\ \end{align} </math>

<math>H_i</math> R G B
0 <math>V</math> <math>V_{inc}</math> <math>V_{min}</math>
1 <math>V_{dec}</math> <math>V</math> <math>V_{min}</math>
2 <math>V_{min}</math> <math>V</math> <math>V_{inc}</math>
3 <math>V_{min}</math> <math>V_{dec}</math> <math>V</math>
4 <math>V_{inc}</math> <math>V_{min}</math> <math>V</math>
5 <math>V</math> <math>V_{min}</math> <math>V_{dec}</math>

Полученные значения красного, зелёного и синего каналов RGB исчисляются в процентах. Чтобы привести их в соответствие распространённому представлению COLORREF необходимо умножить каждое из них на <math>\frac{255}{100}</math>.

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

Дополнительные цвета

Шаблон:Main Два цвета называются дополнительными, если при смешивании их в равной пропорции получается чистый серый цвет. Если задан один цвет <math>\left(H, S, V\right)</math>, то обязательно существует дополнительный ему цвет <math>\left(H', S', V'\right)</math>. Поскольку результирующий цвет должен быть серым, его насыщенность (S) должна быть равна 0. Таким образом,

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

См. также

Ссылки

Шаблон:Цветовые модели