The HSL color space, also called HLS or HSI, stands for Hue, Saturation, Lightness (also Luminance or Luminosity) / Intensity. While HSV (Hue, Saturation, Value) can be viewed graphically as a color cone or hexcone, HSL is drawn as a double cone or double hexcone. Both systems are non-linear deformations of the RGB colour cube. The two apexes of the HSL double hexcone correspond to black and white. The angular parameter corresponds to hue, distance from the axis corresponds to saturation, and distance along the black-white axis corresponds to lightness. Image File history File links Download high resolution version (1905x2025, 1193 KB)color cones Hello I contributed with this image to wikipedia. ... For the city in Vietnam, see Huế A hue refers to the gradation of color within the optical spectrum, or visible spectrum, of light. ... Scale of saturation (0% at bottom). ... As applied to analog television signals, two different words are used, luminance and luma, meaning two different things. ... Intensity is a widely-used term, which can mean: In colloquial use: Strength Amplitude Level In physics: Intensity, power per unit area (W/m2) Field strength of electric, magnetic, or electromagnetic fields. ... The HSV (Hue, Saturation, Value) model, also called HSB (Hue, Saturation, Brightness), defines a color space in terms of three constituent components: HSV color space as a color wheel Hue, the color type (such as red, blue, or yellow): Ranges from 0-360 (but normalized to 0-100% in some... A cone is a basic geometrical shape: see cone (solid). ... The RGB color model utilizes the additive model in which red, green, and blue light are combined in various ways to create other colors. ... A cube (or regular hexahedron) is a three-dimensional Platonic solid composed of six square faces, with three meeting at each vertex. ...

Converting from RGB

Let MAX equal the maximum of the (R, G, B) values, and MIN equal the minimum of those values. The formula can then be written as

HSL and HSV have the same definition of hue, but the other components differ. The other two components of HSV are defined as follows: The HSV (Hue, Saturation, Value) model, also called HSB (Hue, Saturation, Brightness), defines a color space in terms of three constituent components: HSV color space as a color wheel Hue, the color type (such as red, blue, or yellow): Ranges from 0-360 (but normalized to 0-100% in some... For the city in Vietnam, see Huế A hue refers to the gradation of color within the optical spectrum, or visible spectrum, of light. ...

Comparison of HSL and HSV

HSL is similar to HSV but better reflects the intuitive notion of "saturation" and "lightness" as two independent parameters, and is therefore more suitable for use by artists. 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: The HSV (Hue, Saturation, Value) model, also called HSB (Hue, Saturation, Brightness), defines a color space in terms of three constituent components: HSV color space as a color wheel Hue, the color type (such as red, blue, or yellow): Ranges from 0-360 (but normalized to 0-100% in some... In computing, Cascading Style Sheets (CSS) is a stylesheet language used to describe the presentation of a document written in a markup language. ... The World Wide Web Consortium (W3C) is a consortium that produces standards—recommendations, as they call them—for the World Wide Web. ...

• In HSL, the Saturation component always goes from fully saturated color to the equivalent gray (in HSV, with V at maximum, it goes from saturated color to white, which may be considered counterintuitive).
• The Lightness in HSL always spans the entire range from black through the chosen hue to white (in HSV, the V component only goes half that way, from black to the chosen hue).

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 you can choose saturation and value/lightness for the selected hue. With this representation, the difference between HSV or HSL is irrelevant. However, many programs also let you 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:

• Applications that use HSV (HSB):
  • Adobe graphic applications (Illustrator, Photoshop, and others)
  • The GIMP
  • Apple Mac OS X system color picker (has a color disk for H/S and a slider for V)
  • Xara X

• Applications that use HSL:
  • Inkscape (starting from version 0.42)
  • Paint Shop Pro
  • Microsoft Windows system color picker
  • The CSS3 specification

• Applications that use both HSV and HSL:
  • Pixel32 (starting from Beta5)

Adobe Illustrator is a vector-based drawing program developed and marketed by Adobe Systems. ... Adobe Photoshop is a graphics editor (with some text and vector graphics capabilities) developed and published by Adobe Systems. ... Often, the name GIMP is used erroneously for the Gimp-Print printer driver set. ... Mac OS X is the operating system which is included with all shipping Apple Macintosh computers in the consumer and professional markets. ... Xara X is a vector graphics editor created by a small British software company named Xara, notable for being the first vector graphics software product to provide fully anti-aliased display, advanced gradient fill and transparency tools, now available in many of the competitors products. ... Inkscape is an open source vector graphics editor. ... Paint Shop Pro (PSP) is a bitmap graphics editor and vector graphics editor for computers running the Microsoft Windows operating system that was originally published by Minneapolis-based Jasc Software. ... Microsoft Windows is a series of operating environments and operating systems created by Microsoft for use on personal computers and servers. ... In computing, Cascading Style Sheets (CSS) is a stylesheet language used to describe the presentation of a document written in a markup language. ... Screenshot of Pixel32 running in Windows Screenshot of Pixel32 running in Linux Screenshot of Pixel32 running in Mac OS X Screenshot of Pixel32 running in BeOS/Zeta Pixel32 is an Adobe Photoshop clone written by Pavel Kanzelsberger, from Slovakia. ...

Examples

See also

• Color space:
  • RGB color model commonly used for color monitors
  • CMYK color model for color printing
  • HSV color space
  • HLS color space
  • RYB color model the traditional color model used by artists.
  • YUV for PAL television
  • YIQ for NTSC television

A color model is an abstract mathematical model describing the way colors can be represented as tuples of numbers, typically as three or four values or color components (e. ... The RGB color model utilizes the additive model in which red, green, and blue light are combined in various ways to create other colors. ... Cyan, magenta, yellow, and key (black) CMYK (or sometimes YMCK) is a subtractive color model used in color printing. ... The folder of newspaper web offset printing press Printing is an industrial process for production of texts and images, typically with ink on paper using a printing press. ... The HSV (Hue, Saturation, Value) model, also called HSB (Hue, Saturation, Brightness), defines a color space in terms of three constituent components: HSV color space as a color wheel Hue, the color type (such as red, blue, or yellow): Ranges from 0-360 (but normalized to 0-100% in some... The HLS color space, also called HSL or HSI, stands for Hue, Saturation, Lightness (also Luminance or Luminosity) / Intensity. ... Categories: Stub | Color space ... Example of U-V color plane, Y value = 0. ... For other meanings of PAL see PAL (disambiguation). ... This article needs to be cleaned up to conform to a higher standard of quality. ... NTSC is the analog television system in use in Japan, United States and certain other places, mostly in the Americas (see map). ...

External links

• An explanation of HSL and how it differs from RGB can be found in the W3C's CSS3 Color Module.
• Formulas for converting to and from RGB can be found on EasyRGB.com.
• Models color space HLS, HSI
• THE MOTHER OF ALL HTML COLO(U)R CHARTS — Sites with tables containing large number of colors, including their RGB, CMYK, and HLS values, names, sources, etc.
• Colour Spaces and Digital Cameras
• yafla.com : yaflaColor - Convert between HSL & RGB, and create color themes based upon color theory