Conversion of color space RGB to HSV (HSL)

Transferred from: http://blog.csdn.net/jiangxinyu/article/details/8000999

General 3D programming only need to use RGB color space is good, but in fact, the art staff is more using HSV (HSL), because it is easy to adjust the saturation and brightness.

Sometimes art needs a program to help adjust the saturation to achieve a particular style of rendering effect, this time you need to convert color space.

Source: http://zh.wikipedia.org/wiki/HSL%E5%92%8CHSV%E8%89%B2%E5%BD%A9%E7%A9%BA%E9%97%B4

HSL and HSV(also called HSB) are two related representations of the midpoint of the RGB color space, and they try to describe a more accurate color-aware contact than RGB, and still remain computationally simple. HSL represents HUE (hue),saturation (saturation),lightness (brightness), HSV represents HUE,saturation, value (hue) and HSB denotes hUE,saturation,brightness (lightness).

HSL and HSV both describe the color in the cylinder body point, the center axis of the cylinder is from the bottom of the black to the top of the white and in between them is gray, the angle around the axis corresponds to "hue", the distance to the axis corresponds to "saturation", and the distance along this axis corresponds to "brightness", "hue" or "Lightness".

These two representations are similar in purpose, but differ in method. Both are mathematically cylindrical, but the HSV (hue, saturation, lightness) can conceptually be regarded as the inverted cone of color (black dots at the bottom of the vertex, white on the center of the top), HSL conceptually represents a double cone and sphere (white at the top vertex, black at the bottom vertex, and the center of the largest cross-sectional is a half-way gray Note that although the "hue" refers to the same nature in HSL and HSV, their definition of "saturation" is significantly different.

Since HSL and HSV are simple transformations of the device-dependent RGB, (H, s, l) or (H, s, v) The color defined by the ternary group depends on the specific Red, green and blue "additive primary Colors". Each unique RGB device is accompanied by a unique HSL and HSV space. But (H, s, l) or (H, s,v) triples become explicit when constrained to certain RGB spaces such as SRGB.

The HSV model was founded in 1978 by Elvi Rey Smith.

Motive

Artists sometimes prefer to use the HSV color model instead of the RGB or CMYK model, because it resembles the way human senses color. RGB and CMYK, respectively, are additive primary and subtraction primaries, which define colors in combinations of primary colors, while HSV encapsulates information about colors in a more familiar way: "What color is this?" What's the depth? How is the light and shade? ”。 The HSL color space is similar to HSV, in some ways even better than it is.

[edit] use The HSV color wheel allows the user to quickly select many colors. The cone representation of the HSV model is suitable for displaying the entire HSV color space in a single object.

HSV models are commonly used in computer graphics applications. The HSV color wheel is often used in a variety of application environments where the user must select a color to apply to a particular graphic element. Where hue is represented as a ring; You can use a separate triangle to represent saturation and lightness. Typically, the vertical axis of this triangle indicates saturation, while the horizontal axis represents lightness. In this way, select a color to first select the hue in the ring, and select the desired saturation and lightness from the triangle.

Another visual method of the HSV model is the cone. In this representation, the hue is represented as an angle around the center axis of the cone, and the saturation is expressed as the distance from the centre of the cone's cross-section to the point, and the lightness is expressed as the distance from the center of the cone's cross-section to the vertex. Some representations use the six pyramid. This method is more suitable for displaying the HSV color space in a single object, but due to its three-dimensional nature, it is not suitable for color selection in a two-dimensional computer interface.

The HSV color space can also be expressed as a cylinder similar to the above cone, the hue changes along the outer circumference of the cylinder, and the saturation varies along the distance from the center of the cross-section, and the lightness follows the distance between the cross-section and the top surface. This representation may be considered to be a more accurate mathematical model of the HSV color space, but the number of levels of saturation and hue that can be distinguished in practice decreases as the luminosity approaches black. In addition, the computer typically uses a finite precision range to store the RGB values, which constrains the precision, coupled with the limitations of human color perception, making the cone more practical in most cases.

[Edit]the comparison between HSL and HSV HSL and HSV color space comparisons.

HSL is similar to HSV. For some, HSL better reflects the intuition of "saturation" and "brightness" as two independent parameters, but for others, its saturation definition is wrong, because a very soft almost white color in HSL can be defined as fully saturated. It is controversial for HSV or HSL to be more suitable for human user interfaces.

The CSS3 rules claim that "HSL has the advantage that it is symmetrical concealed and dark (HSV is not) ...", which means:

• In HSL, the saturation component always changes from a fully saturated color to an equivalent gray (in HSV, at maximum V, saturation changes from full-saturated to white, which can be considered counter-intuitive).
• In HSL, the brightness spans the full range from black over selected hue to White (in HSV, the V component only travels half the stroke, from black to selected hue).

In software, a hue-based color model (HSV or HSL) is usually provided to the user in the form of a linear or circular hue selector and a two-dimensional area (usually square or triangular) that selects the saturation and lightness/lightness of the selected hue. In this representation, the difference between HSV and HSL is irrelevant. However, many programs also allow you to select the lightness/brightness of a color by using a linear slider or a Value entry box, whereas for these controls you typically use either HSL or HSV (not both). HSV is traditionally more commonly used. Here are some examples:

GIMP supports a variety of methods for selecting colors within the HSV color space, including the color wheel and color side with the Hue slider.

• Applications that use the HSV (HSB):
  • Apple Mac OS X system color picker (with one h/s color disc and one V slider)
  • Xara Xtreme
  • Paint.NET (with a H/S color plate and a V-slider)
  • Adobe Graphics Applications (illustrator,photoshop, etc.)
  • Turbo Photo

• Applications that use HSL:
  • CSS3 regulations
  • Inkscape (starting from version 0.42)
  • Macromedia Studio
  • Microsoft Windows System color Picker (including Microsoft Paint)
  • Paint Shop Pro
  • ImageMagick

• Applications using both HSV and HSL:
  • Pixel Image editor (starting from Beta5)
  • Pixia
  • Bryce
  • GIMP (HSV for color selection, HSL for color Adjustment)

[edit] compare to other color models

The HSV color space is technically not supported by a one by one mapping of the physical energy spectral density measured in radiometric measurements. Therefore, it is generally not advisable to make a direct comparison between the HSV coordinates and the physical light properties such as wavelength and amplitude.

[edit] formal definition

HSL and HSV are mathematically defined as transformations of the coordinates of the colors R, G , and B in the RGB space.

[Edit] conversion from RGB to HSL or HSV

Set (R, G, b) is the red, green, and blue coordinates of a color, respectively, whose value is a real number between 0 and 1. Set max to be equivalent to R, the largest in G and b . Set min equals the smallest of these values.  To find values in the HSL space (H, s, l), here H ∈[0, 360) is the angle of the hue angle, and s, l ∈[0,1] is saturation and brightness, calculated as:

The value of H is usually normalized to between 0 and 360°. and h = 0 is used for max = min (that is, gray) instead of leaving H undefined.

HSL and HSV have the same hue definition, but the other components are different. The values of the HSV color s and v are defined as follows:

[Edit] conversion from HSL to RGB

A color defined by the (H, s, l) value in a given HSL space, with H in the range of values that indicate the hue angle [0, 360], respectively, s and l in the range [0, 1], corresponding to the RGB space ( R, G, b) Three primary colors, with the corresponding to the red, green and blue R, g and b are also in the range [0, 1], which can be calculated as:

First, if s = 0, the color of the result is non-colored, or gray. In this particular case,R, G and b are equal to l. Note that the value of H is undefined in this case.

When s ≠0, you can use the following procedure:^[1]

( H normalized to range [0,1)]

For each color vector , color = (Colorr, colorg, colorb) = (R, G, C19>b),

[Edit] conversion from HSV to RGB

Similarly, given a color defined in the HSV (H, s, v) values, with has above, and s and v< that represent saturation and lightness, respectively The/c31> varies from 0 to 1, and the corresponding (R, G, b) Primary colors in the RGB space can be calculated as:

For each color vector (r, G, b),

[Edit] example

The range of RGB values shown is 0.0 to 1.0.

Rgb	Hsl	Hsv	Results
(1, 0, 0)	(0°, 1, 0.5)	(0°, 1, 1)
(0.5, 1, 0.5)	(120°, 1, 0.75)	(120°, 0.5, 1)
(0, 0, 0.5)	(240°, 1, 0.25)	(240°, 1, 0.5)

HSV Color Space
The model of the HSV (hue,saturation,value) color space corresponds to a conical subset in the cylindrical coordinate system, and the top face of the cone corresponds to v=1. It contains r=1,g=1,b=1 three polygons in the RGB model, which represents a lighter color. The color h is given by the rotation angle around the V-axis. The red corresponds to the angle 0°, the green corresponds to the angle 120°, the blue corresponds to the angle 240°. In the HSV color model, each color differs from its complement by 180 °. Saturation s takes values from 0 to 1, so the radius of the top of the cone is 1. The Color field represented by the HSV color model is a subset of the CIE chromaticity graph, with a saturation of 100% in the model, which is generally less than 100% in purity. At the apex of the cone (that is, the origin), v=0,h and s are undefined and represent black. The top of the cone is s=0,v=1,h undefined at the center of the face, representing white. From this point to the origin represents the dimmed gray of the brightness, which is gray with different shades of gray. For these points, the value of s=0,h is undefined. It can be said that the V axis in the HSV model corresponds to the main diagonal in the RGB color space. The color on the circumference of the top of the cone, V=1,s=1, is a solid color. The HSV model corresponds to the painter's method of color matching. The painter uses the method of changing the color concentration and the color depth to obtain the color of different tones from a solid color, adding white in a solid color to change the color concentration, adding black to change the color depth, and adding different proportions of white, Black can obtain a variety of different shades.

The HSV color space can be described by a cone-space model.

Conversion from RGB to HSV

Set (R, G, b) is the red, green, and blue coordinates of a color, respectively, whose value is a real number between 0 and 1. Set max to be equivalent to R, the largest in G and b . Set min equals the smallest of these values. To find the value in HSV space (H, s, v), here H ∈[0, 360) is the angle of the hue angle, while s, v ∈[ 0,1] is saturation and brightness, calculated as:

Max=max (R,G,B)
Min=min (R,G,B)
If R = max, H = (g-b)/(Max-min)
If G = max, H = 2 + (b-r)/(Max-min)
If B = max, H = 4 + (R-G)/(Max-min)

H = h * 60
If h < 0, H = H + 360

V=max (R,G,B)
S= (max-min)/max

The value of H is usually normalized to between 0 and 360°. and h = 0 is used for max = min (that is, gray) instead of leaving H undefined.

The following is the corresponding VC code:

void Rgb2hsv (float R, float G, float B, float& H, float& S, Float&v)
{
R,g,b values is from 0 to 1
h = [0,360], s = [0,1], v = [0,1]
if s = = 0, then H =-1 (undefined)

float min, Max, delta,tmp;
tmp = MIN (R, G);
min = min (tmp, B);
TMP = MAX (R, G);
max = MAX (tmp, B);
V = max; V

Delta = max-min;

if (max! = 0)
S = Delta/max; S
Else
{
r = G = b = 0//s = 0, V is undefined
S = 0;
H = Undefinedcolor;
Return
}
if (R = = max)
H = (g-b)/delta; Between Yellow & Magenta
else if (G = = max)
H = 2 + (B-R)/delta; Between Cyan & Yellow
Else
H = 4 + (R-G)/delta; Between Magenta & Cyan

H *= 60; Degrees
if (H < 0)
H + = 360;
}

YUV Color Space

YUV (also known as YCRCB) is a color coding method (belonging to PAL) adopted by the European television system. In modern color TV system, three-tube color camera or color CCD camera is usually used to take the image, and then the obtained color images are separated and corrected to get RGB, then the luminance signal Y and two chromatic aberration signal r-y (i.e. u), b-y (ie, v) are obtained by the matrix transform circuit. The final transmitter encodes three signals of brightness and chromatic aberration, which are sent out using the same channel. This color is represented by the so-called YUV color space representation. The importance of using YUV color space is that its luminance signal y and chroma signal u, v are separated. If only the Y signal component does not have a U, v signal component, then the image represented here is a black-and-white grayscale image. Color TV using YUV space is precisely to use brightness signal y to solve the compatibility problem between color TV and black and white TV, so that the black and white machine can also receive color TV signals.

Advantage Effect

YUV is mainly used to optimize the transmission of color video signal, so that it is backward compatible with old black and white. Compared with the RGB video signal transmission, its greatest advantage is that it takes only a very small bandwidth (RGB requires three separate video signals to transmit simultaneously). where "Y" is the luminance (luminance or luma), which is the grayscale value, and "U" and "V" are the chroma (chrominance or Chroma), which describes the color and saturation of the image used to specify the color of the pixel. "Brightness" is established through the RGB input signal by overlaying specific portions of the RGB signal together. "Chroma" defines two aspects of color-hue and saturation, respectively, by CR and CB. Where CR reflects the difference between the red part of the GB input signal and the luminance value of the RGB signal. CB reflects the RGB input signal blue part and RGB signal brightness value of the difference.

The importance of using YUV color space is that its luminance signal y and chroma signal u, v are separated. If only the Y signal component does not have a U, v component, then the image represented here is a black-and-white grayscale image. Color TV using YUV space is precisely to use brightness signal y to solve the compatibility problem between color TV and black and white TV, so that black and white machine can also receive color TV signal.

The formula for conversion between YUV and RGB is as follows (RGB values range from 0-255):
Y = 0.299R + 0.587G + 0.114B
U = -0.147r-0.289g + 0.436B
V = 0.615r-0.515g-0.100b
R = Y + 1.14V
G = y-0.39u-0.58v
B = Y + 2.03U

Conversion of color space RGB to HSV (HSL)