So, because you have years of experience looking after the application, you’ve been invited to join the team that is going to produce a Windows-like interface for new users or web-based users to use when they need to run the application. That all seems to make sense, and then the graphic designer starts talking about hues and tints and saturation and you begin to wonder what it is that he’s talking about!
Let’s have a look. The easiest term is hue—it means color. There are three additive primary colors—red, green and blue—and any two of these can be mixed to create the three secondary colors —yellow, magenta and cyan. (In painting, the primary colors are red, yellow and blue and the secondary colors are orange, purple and green.) There are six tertiary colors created by mixing one primary and one secondary color. They are azure, violet, rose, orange, chartreuse and spring green. In painting, they would be vermilion, amber, chartreuse, teal, violet and magenta. From these 12, you can get any number of intermediates.
Colors are often arranged on a color wheel. Colors from opposite sides of the color wheel are called complementary colors.
Now, if you lighten (add white) to any of those colors, you have tints. If you darken (add black) any of the 12 colors, you produce a shade. Tones are created by adding gray (black and white). Tints are usually thought of as feminine or youthful, soft and soothing. Shades are thought of as powerful and mysterious. Tones are thought of as complex or sophisticated.
The colors on a computer screen can be described in terms of hue, value and chroma, but graphics programs typically use the hue, saturation and lightness (HSL) of the light coming from the screen.
We know what hue is. Saturation is measured as a percentage, where 100 percent is the pure color and 0 percent is gray at a constant lightness level. So, a pure color is fully saturated. Desaturated images are thought to be dull, but can be thought of as being softer.
Lightness is measured as a percentage, where 0 percent is dark and 100 percent is fully illuminated. The original hue has an average lightness level of 50 percent. Think of it as going from fully shaded to fully tinted. Brightness is sometimes used interchangeably with lightness but technically isn’t a color property.
The Munsell color system specifies colors using three color dimensions: hue, chroma (color purity), and value (lightness). Chroma is the Greek word for color. Chroma represents the ‘purity’ or strength of a color, and is similar to saturation with lower chroma being less pure or more washed out looking. Value, or lightness, varies from black (with a value of 0) to white (with a value of 10). The range of chroma values is different with different values and hues.
Sometimes the word ‘intensity’ is used. This could mean the same as saturation, or could refer to the number of photons be emitted.
A gray scale is a series of neutral colors, ranging from black to white or vice versa. Each step’s color value is usually shifted by a constant amount.
It can all seem very confusing. Most people have receptors (cones) for three colors in their eyes, but some people have receptors for four colors (tetrachromacy). And apart from Munsell’s attempt to classify colors, there are others, such as the Optical Society of America Uniform Color Space, and the International Commission on Illumination’s CIELAB and CIECAM02 color models.
Did I mention the RGB (red, blue, green) scheme used for the colors of web pages? They are written as six digits, with two digits for each of the main colors. And those digits go from 0 to F (it’s base 16). The combination of red, green and blue values from 0 to 255 gives a total of more than 16 million (256 x 256 x 256) different colors that can be used. In the past, there were 216 so-called web safe colors—ones that you knew would appear like you intended on any screen. Note that printed material uses the CMYK (cyan, magenta, yellow and black) color system.
So, can you remember the difference between tints, shades and tones? Have you used Photoshop enough to have played with the facilities in that to modify images? Perhaps working on arcane bits of Assembler of COBOL isn’t so hard after all compared to all the things that affect the color of one tiny pixel that could appear on a potential user’s screen!
Trevor Eddolls is CEO at iTech-Ed Ltd., an IT consultancy. For many years, he was the editorial director for Xephon’s Update publications and is now contributing editor to the Arcati Mainframe Yearbook. Eddolls has written three specialist IT books, and has had numerous technical articles published. He currently chairs the Virtual IMS and Virtual CICS user groups.