Gamut mapping

The Chromaticity diagram is a two-variable system for specifying the hue and
saturation of colors (together called chroma) producible using a particular set
of primaries. It is derived from the 3D colorspace defined by those primaries
[link to Katie's threedgamut applet] by factoring out brightness as a variable.
The XYZ chromaticity diagram is one such chromaticity diagram, defined by the
CIE in 1931. While its primaries are physically unrealizable, they are
standardized. This allows colorists in different industries to talk precisely
to each other about colors.

One of the things colorists talk about is - what is the range of colors
displayable on a particular computer screen or reproducible on paper by a
particular printer? This range is called the gamut of that display or
printer. Another question they ask is - if the colors I want to reproduce lie
outside the gamut of my display or printer, how should I modify them to make
them displayable, without excessively distorting the overall design of my
image. The modification process is called gamut mapping, and the
alternative strategies for avoiding color distortion (there are several of
them) during gamut mapping are called rendering intents. In this
applet we explore these concepts.

The XYZ chromaticity diagram

As explained in the preceeding applet, in the
XYZ chromaticity diagram the locus of spectral colors sits in the all-positive
octant. In the brightness-removed (i.e. projected) 2D version of this diagram,
the axes are x and y, and the locus sits in the all-positive quadrant. In
other words, the familiar horseshoe shape of the locus (plus the line of
extra-spectral purples that connects its red and blue endpoints) lies entirely
to the right of the y-axis and entirely above the x-axis. As already
explained, the neutral point (doubly outlined white dot) lies at (x,y) =
(1/3,1/3).

Gamuts of reproducible colors

Inside the locus of spectral colors is a triangle, labeled sRGB. sRGB is a
standardized colorspace, based on three standardized primaries. The
chromaticities of these primaries are given by the apices of the triangle (red,
green, and blue dots), and the interior of the triangle represents all colors
that can be reproduced using mixtures of the primaries. Note that the spectral
power distribution of these primaries is not specified, only their
chromaticities.

One could undoubtedly build a physical display device whose primaries exactly
matched those of the sRGB colorspace, but most devices don't. To represent the
gamut for a hypothetical display device, we've drawn a second triangle (purple
dots) inside the sRGB triangle. The primaries of this hypothetic device are
reddish, greenish, and blueish, like those of sRGB, but they are clearly less
saturated, because they lie closer to the neutral point. If you click on one
of the purple dots, you can move these primaries around, although we limit you
to the interior of the sRGB gamut. We'll see shortly what this is good for.

On the left side of the applet is a radio button labeled NTSC Display. In 1953
the NTSC (National Television Standards Committee) defined a particular set of
three primaries, hence a 3D colorspace, by which the R,G,B values of a color
television signal could be interpreted. (These RGB values are actually
converted to another system, YIQ, for transmission, then converted back to RGB
for display.) The sRGB standard was developed after NTSC, and as you can see
it has a slightly smaller gamut, especially in the greens. To the extent that
manufacturers could build physical television sets whose primaries were as
saturated as the apices of the NTSC triangle, these sets could display all
colors in the NTSC gamut at full fidelity.

Below this is another radio button labeled Typical Printer. Its gamut has six
apices, hence six primaries. As we discussed in the
introductory applet,
adding more primaries doesn't create a higher-dimensional colorspace, but it
does allow you to create more saturated colors within the 3D colorspace humans
can perceive. Modern offset printing consists of laying down dots of cyan (C),
magenta (M), and yellow (Y) ink. Where the cyan and yellow dots coincide,
their inks sit atop one another, hence their spectra mix subtractively,
yielding green. Similarly, superpositions of cyan and magenta dots yield blue,
and superpositions of magenta and yellow dots yield red. Thus, the printed
page contains dots of cyan, magenta, yellow, red, green, and blue, which mix
additively in your eye if you stand back far enough. This constitutes a
six-primary system, denoted in the chromaticity diagram by a six-pointed
figure. The mathematics that describe how CMY dots mix subtractively to
produce CMYRGB dots, and how these mix additively in your eye, are called the
Neugebauer
equations.

Finally, we invite you to create your own hypothetical 3-primary, 4-primary, or
5-primary gamut, by clicking on the corresponding radio buttons, then dragging
around the purple dots. By the way, if you're confused about how additive
versus subtractive mixing works, then you're a candidate for our
final applet on color.

Gamut mapping and rendering intents

In the top-left corner of the applet is a picture of a parrot. Actually,
parrots don't look this bright; we've fiddled with his hairdo a bit to make his
colors more saturated and to span more parts of the gamut. Superimposed on the
picture is a grid of small white dots. The colors in the picture at each dot
are denoted in the chromaticity diagram at right by the small white dots. If
you click on a dot on the picture, the corresponding dot in the chromaticity
diagram is highlighted, and vice versa - a visualization technique called
brushing.

Click on the 3-primary gamut. Suppose this represented the gamut of your
display device. Note that many of the parrot's colors lie outsite this gamut.
To display the parrot on this device, you must modify these colors to like
inside the device's gamut. This process is called gamut mapping.
There are several reasonable strategies for performing this modification; these
are called rendering intents. Four particular strategies were defined
by the International Color Consortium (ICC),
with the four names shown on the applet. Interestingly, these strategies were
defined in prose only; see this web
site to read these definitions, or
this one.
The actual implementation of each strategy was left to the software writer.
Indeed, different vendors compete fiercely on the alleged quality of their
gamut mapping techniques.

To see how these gamut mapping strategies compare, click on Absolute
Colormetric and watch the animation. The intent of this gamut mapping strategy
is to bring out-of-gamut colors back into gamut with the minimum possible
change to them, and to leave in-gamut colors alone. We've interpreted this as
projecting each out-of-gamut color perpendicularly onto the nearest edge of the
gamut. Compare the Before and After pictures of the parrot. Only his face
changed dramatically (those pesky out-of-gamut blues!). Note that his
face both desaturates and turns slightly purple.

Now click on No Gamut Mapping, then Relative Colorimetric. The intent of this
strategy is to bring out-of-gamut colors back into gamut by desaturating them,
but trying hard not to change their hues. We've interpreted this as projecting
each each-of-gamut color towards the neutral point until it falls within gamut.
This makes a bigger change in the parrot's face than under Absolute
Colorimetric, but at least it stays blue, rather than turning purple.

Now try Perceptual. The intent here is to bring out-of-gamut colors back into
gamut, while minimizing changes in the relationships between different colors.
We've interpreted this as projecting all colors proportionately towards the
neutral point until every color lies within gamut. This dramatically
desaturates everything, but the relationships between colors stay plausible.
It's as if the parrot were being viewed through white fog (technically, fog
whose color is equal to the device's white point).

Finally, try Saturation. It's like Perceptual, but the projection is not
proportional. Instead, out-of-gamut colors are moved more than in-gamut
colors. The effect is to keep highly saturated colors as saturated as
possible. This strategy is commonly employed for corporate logos and similar
graphics, but not for photographs. The most common strategy for photographs
is Perceptual. In Photoshop, this is the default.

Some implementation details

The astute reader will notice that our locus of spectral colors is filled with
color, even though most parts of the locus must certainly lie outside the gamut
of the physical display they are looking at. Indeed, we should be displaying
any colors there. However, we wanted to give you an intuition for which colors
lie where in the locus, and we don't know the gamut of your display anyway, so
we decided to fill the entire locus with color, even if they are less saturated
than real near-spectral colors would be. In fact, we have desaturated these
colors more than strictly necessary, to make sure the various triangles and
dots we draw within the locus are clearly visible. As a result, the colors
under the dots in the picture of the parrot don't exactly match the colors
under the corresponding dots in the chromaticity diagram. In other words, it's
a visualization, not an accurate depiction.

One more point. We've described gamut mapping as a projection in flatland,
operating in the 2D xy chromaticity diagram. In reality it should be a
projection in 3-space, operating in the 3D XYZ chromaticity diagram depicted in
the preceeding applet.
As discussed on this
web page, it is possible for a dark color to lie within the gamut of a
particular device, while a brighter color of the same chromaticity lies outside
the gamut. However, this effect is relatively minor, and limiting ourselves to
a two-dimensional view makes the story easier to tell.