Updated 9/10/2019

Return to the Chromaticity Diagram

Description of the Diagram

The square graph on the previous page is a "Chromaticity Diagram." Its (x,y) axes are relative response values for two of the eye's three cone types due to the absorption of photons in incident light. The yellow dots show the locus of visible-light photon wavelengths in nanometers (nm) and they are 5nm apart. The Diagram includes a vertical slider labeled I and a yellow cross-hair, both of which can be dragged using your mouse button. In some browsers the slider value I will not change until the mouse button is released.

To the right of the Chromaticity Diagram is a solid-color display panel which shows the color corresponding to the positions of the cross-hair and intensity slider. Surrounding the solid-color display panel there is a W3C-specified gray-border viewing environment for the displayed color.

To the right of the display panel is a set of numerical values for some of the quantities described below.

The Symbols Used

  1. R,G,B:
    R, G, and B are the intensities of light coming from the Red, Green, and Blue emitters, respectively, in a pixel on a computer or TV screen. Each value of R, G, or B is a decimal integer in the range 0-255 or, equivalently, a hex number in the range (00-FF). When the hex numbers are used to describe RGB they are generally concatenated and the resulting six-digit hex number is usually preceded by a '#' symbol.

    We use sRGB which is a 3-beam emittance standard detailed by the International Color Consortium. It is specified by the World Wide Web Consortium as the current web standard for monitors.

  2. x,y,z:
    x, y, and z are the relative response intensities of an eye pixel's three cones when light is absorbed by the cones.
    An eye pixel's x-cone responds maximally to the shorter wavelengths of visible light such as the blues and violets.
    An eye pixel's y-cone responds maximally to the medium wavelengths of visible light such as the blue-greens and greens.
    An eye pixel's z-cone responds maximally to the longer wavelengths of visible light such as the oranges and reds.

    The values of (x,y,z) are stated as fractions of the total response of the pixel's cones so: x + y + z = 1. Thus z can always be deduced from x and y.

  3. W,S,I:

    W: For some particular color of interest, our hue "W" for that color is the wavelength of the photon color which can be mixed with white to produce that color. Picture this geometrically: on a Chromaticity Diagram draw a straight line from the white point to the point of the color of interest, then continue the line on to a photon point. That photon's wavelength, in nm, is the numerical value for our W. Our W is sometimes called the color's "dominant wavelength" but photons of that wavelength do not have to even exist in the spectrum of the light which is being used to produce the color of interest. Note that a hue W cannot be used to describe a color which is on or near the "purple line" connecting the two ends of the visible-photon locus on the Chromaticity Diagram and that is because, for those colors, a line from the white point to the color-of-interest point will never intersect the visible-photon locus.

    S: Our saturation "S" of a color is the fraction of the hue line that lies between the white point and the color-of-interest point. We state its value in percent so an S of 0% means the color is pure white, regardless of the W value, while an S of 100% means the color of interest is composed of photons which all have the same hue (W).

    I: The value of I for an emitting pixel of a screen is defined as the maximum one of the pixel's R,G,B values, expressed as a fraction of 255. Thus if RGB = (51,153,102) then I = 153/255 = 0.60. The value of I is what separates the individual members of an (x,y) color family or, equivalently, a (W,S) color family. For example, all of the CSS3 colors in the following table are members of the same (x,y) or (W,S) family and are distinguished from each other by their I values. Also shown are their corresponding sRGB values from which x and y can be deduced using Lindbloom's Calculator with these settings: (a) Ref. White: D65; (b) RGB Model: sRGB; (c) Adaptation: None; (d) Scale RGB. The value of I can be directly calculated from R,G,B as described above.

    Here are the 9 named members of the color family at (x,y) = (0.3127,0.3290) or (W,S) = (any,0%):

    color I RGB(decimal) RGB(hex)
    white 1.00 (255,255,255)#FFFFFF
    gainsboro 0.86 (220,220,220)#DCDCDC
    lightgray 0.83 (211,211,211)#D3D3D3
    silver 0.75 (192,192,192)#C0C0C0
    darkgray 0.66 (169,169,169)#A9A9A9
    gray 0.50 (128,128,128)#808080
    dimgray 0.41 (105,105,105)#696969
    bkgdgray 0.20 (051,051,051)#333333
    black 0.00 (000,000,000)#000000

    Note: The color "black" in the last line of the table shown above is a total absence of light and thus cannot be directly "seen." However, objects painted with commercial "black paint" do reflect some light and that reflected light has small but non-zero values for R,G,B.

© Project Physnet, 2019; Contact: Peter Signell, signell@msu.edu