HCL color space

From Wikipedia, the free encyclopedia
Jump to navigation Jump to search

HCL (Hue-Chroma-Luminance) is a color space model designed to accord with human perception of color. HCL has been adopted by information visualization practitioners to present data without the bias implicit in using varying saturation.[1][2][3]


The sRGB gamut plotted within the cylindrical CIE LChab color space. L is the vertical axis; C is the cylinder radius; h is the angle around the circumference.

HCL is designed to have characteristics of both cylindrical translations of the RGB color space, such as HSL and HSV, and the L*a*b* color space.[4] The HSL and HSV color spaces are more intuitive translations of the RGB color space, because they provide a single hue number. However, their luminance variation does not match the way humans perceive color. Perceptually uniform color spaces outperform RGB in cases such as high noise environments.[5] The L*a*b color space does correspond to the three channels of human perception, but it has poor hue constancy, especially in the blue range.[6]

HCL uses the CIELAB model defined by the International Commission on Illumination (CIE) in 1976, translated into polar coordinates. HCL preserves the L (luminance) axis of L*a*b*, but transforms ab to polar coordinates, where the distance from zero is the chroma (an alternative measure of colorfulness), and the phase (angle) is our familiar hue. The older Munsell color system is based on different mathematics, but has some similarity to HCL.


Color-making attributes[edit]

The dimensions of the HSL and HSV geometries—simple transformations of the not-perceptually-based RGB model—are not directly related to the photometric color-making attributes of the same names, as defined by scientists such as the CIE or ASTM. Nonetheless, it is worth reviewing those definitions before leaping into the derivation of our models.[7]

The "attribute of a visual sensation according to which an area appears to be similar to one of the perceived colors: red, yellow, green, and blue, or to a combination of two of them".
Radiance (Le,Ω)
The radiant power of light passing through a particular surface per unit solid angle per unit projected area, measured in SI units in watt per steradian per square metre (W·sr−1·m−2).
Luminance (Y or Lv,Ω)
The radiance weighted by the effect of each wavelength on a typical human observer, measured in SI units in candela per square meter (cd/m2). Often the term luminance is used for the relative luminance, Y/Yn, where Yn is the luminance of the reference white point.
Luma (Y′)
The weighted sum of gamma-corrected R′, G′, and B′ values, and used in Y′CbCr, for JPEG compression and video transmission.
The "attribute of a visual sensation according to which an area appears to emit more or less light".
Lightness, value
The "brightness relative to the brightness of a similarly illuminated white".
The "attribute of a visual sensation according to which the perceived color of an area appears to be more or less chromatic".
The "colorfulness relative to the brightness of a similarly illuminated white".
The "colorfulness of a stimulus relative to its own brightness".

Brightness and colorfulness are absolute measures, which usually describe the spectral distribution of light entering the eye, while lightness and chroma are measured relative to some white point, and are thus often used for descriptions of surface colors, remaining roughly constant even as brightness and colorfulness change with different illumination. Saturation can be defined as either the ratio of colorfulness to brightness or of chroma to lightness.

Transformation from RGB to HCL[edit]



or, if the atan2 function is not available, use the arc tangent function followed by a correction:

if ((R−G) < 0 and (G−B) ≥ 0), then H = H+180

if ((R−G) < 0 and (G−B) < 0), then H = H−180



Q is a tuning parameter that varies luminosity between a highly saturated color and white.

corresponds to the correction factor in L*a*b*


d3.js Data Driven Documents JavaScript library

colorspace for the R statistical programming language

The chroma.js JavaScript library

Other uses of HCL acronym[edit]

The terms hue, chroma and luminance or lightness can, of course, be used in other contexts. Thus a discussion of HCL may not refer specifically to cylindrical LAB.

Some sources use HCL as an alternative name for the L*C*h(uv) color space, also known as the cylindrical representation or polar CIELUV.


  1. ^ Ihaka, Ross (2003). "Colour for Presentation Graphics". In Hornik, Kurt; Leisch, Friedrich; Zeileis, Achim (eds.). Proceedings of the 3rd International Workshop on Distributed Statistical Computing, Vienna, Austria. ISSN 1609-395X.
  2. ^ Zeileis, Achim; Hornik, Kurt; Murrell, Paul (2009). "Escaping RGBland: Selecting Colors for Statistical Graphics". Computational Statistics & Data Analysis. 53: 3259–3270. doi:10.1016/j.csda.2008.11.033.
  3. ^ Stauffer, Reto; Mayr, Georg J.; Dabernig, Markus; Zeileis, Achim (2015). "Somewhere over the Rainbow: How to Make Effective Use of Colors in Meteorological Visualizations". Bulletin of the American Meteorological Society. 96 (2): 203–216. doi:10.1175/BAMS-D-13-00155.1.
  4. ^ a b Sarifuddin, M. & Missaoui, Rokia (2005). A New Perceptually Uniform Color Space with Associated Color Similarity Measure for Content-Based Image and Video Retrieval (PDF). Multimedia Information Retrieval Workshop, 28th Annual ACM SIGIR Conference.
  5. ^ Paschos, G. (2001). "Perceptually Uniform Color Spaces for Color Texture Analysis: An Empirical Evaluation". IEEE Transactions on Image Processing. 10 (6): 932–937. doi:10.1109/83.923289.
  6. ^ McLellan, M. R.; Lind, L. R.; Kime, R. W. (1995). "Hue Angle Determinations and Statistical Analysis for Multiquadrant Hunter L,a,b Data". Journal of Food Quality. 18 (3): 235–240. doi:10.1111/j.1745-4557.1995.tb00377.x.
  7. ^ Ware, Colin (2012). "Lightness, Brightness, Contrast, and Constancy". Information Visualization: Perception for Design (3rd ed.). pp. 69–95. doi:10.1016/B978-0-12-381464-7.00003-X.

External links[edit]