Citizendia
Your Ad Here

Graphical depiction of HSV
Graphical depiction of HSV
HSL arranged as a double-cone
HSL arranged as a double-cone

HSL and HSV are two related representations of points in an RGB color space, which attempt to describe perceptual color relationships more accurately than RGB, while remaining computationally simple. An RGB color space is any additive Color space based on the RGB color model. HSL stands for hue, saturation, lightness, while HSV stands for hue, saturation, value. Hue is one of the main properties of a Color described with names such as " Red " " Yellow " etc In Colorimetry and Color theory, colorfulness, chroma, and saturation are related but distinct concepts referring to the perceived intensity Lightness is a property of a Color, or a dimension of a Color space, that is defined in a way to reflect the subjective brightness perception of a color for humans

HSI and HSB are alternative names for these concepts, using intensity and brightness; their definitions are less standardized, but they are typically interpreted as synonymous with HSL.

Both HSL and HSV describe colors as points in a cylinder whose central axis ranges from black at the bottom to white at the top with neutral colors between them, where angle around the axis corresponds to “hue”, distance from the axis corresponds to “saturation”, and distance along the axis corresponds to “lightness”, “value”, or “brightness”. A cylinder is one of the most basic curvilinear geometric shapes the Surface formed by the points at a fixed distance from a given Straight line, the axis Black is the Color of objects that do not emit or Reflect Light in any part of the Visible spectrum; they absorb all such frequencies of White is a Color, the perception which is evoked by Light that stimulates all three types of color sensitive Cone cells in the Human eye

The two representations are similar in purpose, but differ somewhat in approach. Both are mathematically cylindrical, but while HSV (hue, saturation, value) can be thought of conceptually as an inverted cone of colors (with a black point at the bottom, and fully-saturated colors around a circle at the top), HSL conceptually represents a double-cone or sphere (with white at the top, black at the bottom, and the fully-saturated colors around the edge of a horizontal cross-section with middle gray at its center). A cone is a three-dimensional Geometric shape that tapers smoothly from a flat round base to a point called the apex or vertex Note that while “hue” in HSL and HSV refers to the same attribute, their definitions of “saturation” differ dramatically.

Because HSL and HSV are simple transformations of device-dependent RGB, the color defined by a (h, s, l) or (h, s, v) triplet depends on the particular color of red, green, and blue “primaries” used. Red is any of a number of similar Colors evoked by light consisting predominantly of the longest wavelengths of Light discernible by the human eye in the wavelength Green is a Color, the perception of which is evoked by light having a spectrum dominated by energy with a Wavelength of roughly 520–570- nm. Blue is a Colour, the Perception of which is evoked by Primary colors are sets of Colors that can be combined to make a useful range ( Gamut) of colors Each unique RGB device therefore has unique HSL and HSV spaces to accompany it. An (h, s, l) or (h, s, v) triplet can however become definite when it is tied to a particular RGB color space, such as sRGB. sRGB is a standard RGB (Red Green Blue color space created cooperatively by HP and Microsoft for use on monitors printers and the Internet

Both models were first formally described in 1978 by Alvy Ray Smith,[1] though the concept of describing colors by these three dimensions, or equivalents such as hue, chroma, and tint, was introduced much earlier. Alvy Ray Smith III (born 8 September 1943) is an American engineer and noted pioneer in Computer graphics. [2]

Contents

Motivation

It is sometimes preferable in working with art materials, digitized images, or other media, to use the HSV or HSL color model over alternative models such as RGB or CMYK, because of differences in the ways the models emulate how humans perceive color. CMYK (short for '''c'''yan, '''m'''agenta, '''y'''ellow, and k ey ( Black) and often referred to as process color RGB and CMYK are additive and subtractive models, respectively, modelling the way that primary color lights or pigments (respectively) combine to form new colors when mixed. An additive color model involves Light emitted directly from a source or illuminant of some sort A subtractive color model explains the mixing of Paints Dyes Inks and natural colorants to create a range of Colors where each such color Primary colors are sets of Colors that can be combined to make a useful range ( Gamut) of colors

Usage

An HSV color wheel allows the user to quickly select a multitude of colors.
An HSV color wheel allows the user to quickly select a multitude of colors.

The HSV model is commonly used in computer graphics applications. In Computer graphics, graphics software or image editing software is a program or collection of programs that enable a person to manipulate visual images In various application contexts, a user must choose a color to be applied to a particular graphical element. When used in this way, the HSV color wheel is often used. A color wheel or color circle is an organization of Color Hues around a circle showing relationships between colors considered to be Primary In it, the hue is represented by a circular region; a separate triangular region may be used to represent saturation and value. Typically, the vertical axis of the triangle indicates saturation, while the horizontal axis corresponds to value. In this way, a color can be chosen by first picking the hue from the circular region, then selecting the desired saturation and value from the triangular region.

The conical representation of the HSV model is well-suited to visualizing the entire HSV color space in a single object.
The conical representation of the HSV model is well-suited to visualizing the entire HSV color space in a single object.

Another visualization method of the HSV model is the cone. In this representation, the hue is depicted as a three-dimensional conical formation of the color wheel. The saturation is represented by the distance from the center of a circular cross-section of the cone, and the value is the distance from the pointed end of the cone. Some representations use a hexagonal cone, or hexcone, instead of a circular cone. This method is well-suited to visualizing the entire HSV color space in a single object; however, due to its three-dimensional nature, it is not well-suited to color selection in two-dimensional computer interfaces.

The HSV color space could also be visualized as a cylindrical object; similar to the cone above, the hue varies along the outer circumference of a cylinder, with saturation again varying with distance from the center of a circular cross-section. Value again varies from top to bottom. Such a representation might be considered the most mathematically accurate model of the HSV color space; however, in practice the number of visually distinct saturation levels and hues decreases as the value approaches black. Additionally, computers typically store RGB values with a limited range of precision; the constraints of precision, coupled with the limitations of human color perception, make the cone visualization more practical in most cases.

Comparison of HSL and HSV

Comparison of the HSL and HSV color spaces.
Comparison of the HSL and HSV color spaces.

HSL is similar to HSV. For some people, HSL better reflects the intuitive notion of "saturation" and "lightness" as two independent parameters, but for others its definition of saturation is wrong, as for example a very pastel, almost white color can be defined as fully saturated in HSL. It might be controversial, though, whether HSV or HSL is more suitable for use in human user interfaces.

The CSS3 specification from the W3C states, "Advantages of HSL are that it is symmetrical to lightness and darkness (which is not the case with HSV for example)…" This means that:

In software, a hue-based color model (HSV or HSL) is usually presented to the user in the form of a linear or circular hue chooser and a two-dimensional area (usually a square or a triangle) where the user can choose saturation and value/lightness for the selected hue. With this representation, the difference between HSV and HSL is irrelevant. However, many programs also let the user select a color via linear sliders or numeric entry fields, and for those controls, usually either HSL or HSV (not both) are used. HSV is traditionally more common. Here are some examples:

The GIMP supports several methods of picking colors within the HSV color space, including the color wheel and a colored square with a hue slider.
The GIMP supports several methods of picking colors within the HSV color space, including the color wheel and a colored square with a hue slider.

Comparison with other color models

The HSV tristimulus space does not technically support a one-to-one mapping to physical power spectra as measured in radiometry. Adobe Creative Suite is a collection of Graphic design, Video editing, and Web development applications made by Adobe Systems. Microsoft Windows is a series of Software Operating systems and Graphical user interfaces produced by Microsoft. Paint (formerly Paintbrush for Windows) is a simple graphics painting program that has been included with almost all versions of Microsoft Windows since Paint Shop Pro ( PSP) is a Raster graphics editor and later in the series a Vector graphics editor for computers running the Microsoft Windows ImageMagick is a free Software suite for Image manipulation and display supporting close to 100 image formats Pixel image editor (formerly known as Pixel32 is an Image editor written by the Slovak programmer Pavel Kanzelsberger Pixia is a Freeware Bitmap graphics editor program for Windows, created by Isao Maruoka Bryce is a 3D modeling, rendering and animation program specializing in Fractal landscapes The name is taken from Bryce Canyon The GNU Image Manipulation Program, or GIMP, is a free Raster graphics editor used to process digital graphics and photographs PaintNET is a raster graphics editing program for Windows, developed on the. In Statistical signal processing and Physics, the spectral density, power spectral density ( PSD) or energy spectral density ( In Optics, radiometry is the field that studies the Measurement of Electromagnetic radiation, including Visible light. Thus it is not generally advisable to try to make direct comparisons between HSV coordinates and physical light properties such as wavelength or amplitude. In Physics wavelength is the distance between repeating units of a propagating Wave of a given Frequency. Amplitude is the magnitude of change in the oscillating variable with each Oscillation, within an oscillating system


Formal specifications

An RGB image of the John Moulton Barn at the base of the Teton Range, along with its h, s and l components.
An RGB image of the John Moulton Barn at the base of the Teton Range, along with its h, s and l components. The Teton Range is a Mountain range of the Rocky Mountains in North America.
An image, along with its h, s and v components. Compare the dark on the left side of the barn roof and the white of the snow; though one is much brighter than the other, these near-neutral colors both have low saturation. Notice that the green grass is highly saturated and of moderate brightness, while the blue of the mountains has consistent hue but widely varying brightness and saturation, and the sky has constant hue and brightness but varying saturation.
An image, along with its h, s and v components. Compare the dark on the left side of the barn roof and the white of the snow; though one is much brighter than the other, these near-neutral colors both have low saturation. Notice that the green grass is highly saturated and of moderate brightness, while the blue of the mountains has consistent hue but widely varying brightness and saturation, and the sky has constant hue and brightness but varying saturation.
An illustration of the relationship between the “hue” of colors with maximal saturation in HSV and HSL with their corresponding RGB coordinates.
An illustration of the relationship between the “hue” of colors with maximal saturation in HSV and HSL with their corresponding RGB coordinates.

HSL and HSV are defined mathematically by transformations between the r, g, and b coordinates of colors in RGB space and the h, s, l, and v coordinates of the HSL and HSV spaces. [3]

Conversion from RGB to HSL or HSV

Let r, g, b ∈ [0,1] be the red, green, and blue coordinates, respectively, of a color in RGB space.

Let max be the greatest of r, g, and b, and min the least.

To find the hue angle h ∈ [0, 360] for either HSL or HSV space, compute:

h = \begin{cases} 0 & \mbox{if } \max = \min \\ (60^\circ \times \frac{g - b}{\max - \min} + 0^\circ)\;\bmod\;360^\circ, & \mbox{if } \max = r \\ 60^\circ \times \frac{b - r}{\max - \min} + 120^\circ, & \mbox{if } \max = g \\ 60^\circ \times \frac{r - g}{\max - \min} + 240^\circ, & \mbox{if } \max = b \end{cases}

To find saturation and lightness s, l ∈ [0,1] for HSL space, compute:

s = \begin{cases} 0 & \mbox{if } \max = \min \\ \frac{\max-\min}{\max+\min} = \frac{\max-\min}{2l}, & \mbox{if } l \leq \frac{1}{2} \\ \frac{\max-\min}{2-(\max+\min)} = \frac{\max-\min}{2-2l}, & \mbox{if } l > \frac{1}{2} \end{cases}
l = \begin{matrix} \frac{1}{2} \end{matrix} (\max + \min)

The value of h is generally normalized to lie between 0 and 360°, and h = 0 is used when max = min (that is, for grays) though the hue has no geometric meaning there, where the saturation s is zero. Similarly, the choice of 0 as the value for s when l is equal to 0 or 1 is arbitrary.

HSL and HSV have the same definition of hue, but the other components differ. Hue is one of the main properties of a Color described with names such as " Red " " Yellow " etc The values for s and v of an HSV color are defined as follows:

s = \begin{cases} 0, & \mbox{if } \max = 0 \\ \frac{\max - \min}{\max} = 1 - \frac{\min}{\max}, & \mbox{otherwise} \end{cases}
v = \max \,

The range of HSV and HSL vectors is a cube in the cartesian coordinate system; but since hue is really a cyclic property, with a cut at red, visualizations of these spaces invariably involve hue circles;[4] cylindrical and conical (bi-conical for HSL) depictions are most popular; Spherical depictions are also possible. In Mathematics, the Cartesian coordinate system (also called rectangular coordinate system) is used to determine each point uniquely in a plane The cylindrical coordinate system is a three-dimensional Coordinate system which essentially extends circular polar coordinates by adding a third coordinate (usually In Mathematics, the spherical coordinate system is a Coordinate system for representing geometric figures in three dimensions using three coordinates the radial

Conversion from HSL to RGB

Given a color defined by (h, s, l) values in HSL space, with h in the range [0, 360), indicating the angle, in degrees of the hue, and with s and l in the range [0, 1], representing the saturation and lightness, respectively, a corresponding (r, g, b) triplet in RGB space, with r, g, and b also in range [0, 1], and corresponding to red, green, and blue, respectively, can be computed as follows:

First, if s = 0, then the resulting color is achromatic, or gray. In this special case, r, g, and b all equal l. Note that the value of h is ignored, and may be undefined in this situation.

The following procedure can be used, even when s is zero:

q= \begin{cases} l \times (1+s), & \mbox{if } l < \frac{1}{2} \\ l+s-(l \times s), & \mbox{if } l \ge \frac{1}{2} \end{cases}
p = 2 \times l - q \,
h_k = {h \over 360} \, (h normalized to be in the range [0,1))
t_R = h_k+\frac{1}{3} \,
t_G = h_k \,
t_B = h_k-\frac{1}{3} \,
\mbox{if } t_C < 0 \rightarrow t_C = t_C + 1.0 \quad \mbox{for each}\,C \in \{R,G,B\}
\mbox{if } t_C > 1 \rightarrow t_C = t_C - 1.0 \quad \mbox{for each}\,C \in \{R,G,B\}

Compute each color component ColorC of the vector (ColorR, ColorG, ColorB) = (r, g, b),

{Color}_C = \begin{cases} p+ \left((q-p) \times 6 \times t_C\right), & \mbox{if } t_C < \frac{1}{6} \\ q, & \mbox{if } \frac{1}{6} \le t_C < \frac{1}{2} \\ p+\left((q-p) \times 6 \times (\frac{2}{3} - t_C) \right), & \mbox{if } \frac{1}{2} \le t_C < \frac{2}{3} \\ p, & \mbox{otherwise } \end{cases}
\mbox{for each}\,C \in \{R,G,B\}

Conversion from HSV to RGB

Similarly, given a color defined by (h, s, v) values in HSV space, with h as above, and with s and v varying between 0 and 1, representing the saturation and value, respectively, a corresponding (r, g, b) triplet in RGB space can be computed:

h_i = \left\lfloor \frac{h}{60} \right\rfloor \mod 6
f = \frac{h}{60} - \left\lfloor \frac{h}{60} \right\rfloor
p = v \times (1 - s) \,
q = v \times (1 - f \times s) \,
t = v \times (1 - (1 - f) \times s) \,

Compute color vector (r, g, b),

(r, g, b) = \begin{cases} (v, t, p), & \mbox{if } h_i = 0 \\ (q, v, p), & \mbox{if } h_i = 1 \\ (p, v, t), & \mbox{if } h_i = 2 \\ (p, q, v), & \mbox{if } h_i = 3 \\ (t, p, v), & \mbox{if } h_i = 4 \\ (v, p, q), & \mbox{if } h_i = 5 \\ \end{cases}

Terminology

The terms attributed to the "L" or "V" component of HSL or HSV color space may be misleading since they have little to do with color science definitions of the terms. In Linear algebra, a coordinate vector is an explicit representation of a vector in an abstract vector space as an ordered list of numbers or equivalently as an In photometry, concepts such as lightness and luminance relate to a weighted spectrum, in which green is much more luminous than blue, and red is between; but in HSL and HSV, the "L" and "V" dimensions treat the three color channels equally.

Spherical and other 3D mappings

Color sphere of Runge, 1810
Color sphere of Runge, 1810
Color sphere of Munsell, 1900
Color sphere of Munsell, 1900

HSL and HSV are related to three-dimensional color-order systems such as Philipp Otto Runge's color sphere (Farben-kugel) and the Munsell color system, both of which are structured around a neutral black-to-white axis, as the HSL and HSV cylinders are. Philipp Otto Runge ( 1777-07-23 – 1810-12-02) was a Romantic German painter and draughtsman In Colorimetry, the Munsell color system is a Color space that specifies Colors based on three color dimensions Hue, value ( lightness Munsell refers to the colorfulness dimension as chroma rather than saturation, and refers to but uses hue and lightness as in HSL. In Colorimetry and Color theory, colorfulness, chroma, and saturation are related but distinct concepts referring to the perceived intensity In Colorimetry, the Munsell color system is a Color space that specifies Colors based on three color dimensions Hue, value ( lightness

Modern works also sometimes map HSL into a sphere, with L along the polar axis, H a longitude, and S a fraction of the radius of the disk at a constant L or latitude. [7][8]

Since the entire top and bottom surfaces of the HSL cylinder are white and black, respectively, nothing is lost in shrinking them to points at the poles of a sphere. Another popular way to shrink the white and black surfaces to points is to map HSL to a bi-cone,[9][10] which fits the same description as the sphere given above, but with a different profile of radius versus L. For HSV, on the other hand, the top surface of the cylinder is not white, so it can not be collapsed to a point, while the bottom can be mapped to a point, since it's all black; therefore, HSV is commonly mapped to a cone.

Examples

The RGB values are shown in the range 0. 0 to 1. 0.

RGB HSL HSV Result
(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)  

Notes

  1. ^ Alvy Ray Smith (August 1978). "Color Gamut Transform Pairs". Computer Graphics 12 (3). doi:10.1145/965139.807361. A digital object identifier ( DOI) is a permanent identifier given to an Electronic document.  
  2. ^ Robert Mearns Yerkes (1911). Introduction to Psychology. H. Holt.  
  3. ^ Max K. Agoston (2005). Computer Graphics and Geometric Modeling: Implementation and Algorithms. Springer. ISBN 1852338180.  
  4. ^ John C. Russ (2005). Image Analysis Of Food Microstructure. CRC Press. ISBN 0849322413.  
  5. ^ Edward H. Adelson (2000). Lightness Perception and Lightness Illusions – Some terminology. Massachusetts Institute of Technology. Retrieved on 2007-07-17. Year 2007 ( MMVII) was a Common year starting on Monday of the Gregorian calendar in the 21st century. Events 180 - Twelve inhabitants of Scillium in North Africa are executed for being Christians
  6. ^ List of Blending Modes. Adobe Help Resource Center. Retrieved on 2007-11-10. Year 2007 ( MMVII) was a Common year starting on Monday of the Gregorian calendar in the 21st century. Events 1444 - Battle of Varna: The crusading forces of King Vladislaus III of Varna (aka Ulaszlo I of Hungary and Wladyslaw
  7. ^ Phil Nelson (2007). The Photographer's Guide to Color Management: Professional Techniques for Consistent Results. Amherst Media, Inc. ISBN 1584282045.  
  8. ^ Abhay Sharma (2003). Understanding Color Management. Thomson Delmar Learning. ISBN 1401814476.  
  9. ^ John C. Russ (2005). Image Analysis Of Food Microstructure. CRC Press. ISBN 0849322413.  
  10. ^ Richard Prikryl (2004). Dimension Stone 2004 - New Perspectives for a Traditional Building Material. Taylor & Francis. ISBN 9058096750.  

References

External links

© 2009 citizendia.org; parts available under the terms of GNU Free Documentation License, from http://en.wikipedia.org
 Dapyx Software network: MP3 Explorer | Ebook Manager | Zenithic