Color Crash Course Part 1: Color in the Digital World
Updated: May 7, 2021
How well do you know colors? It is imperative that artists, both traditional and digital, have a clear understanding of colors in theory and practice. There is confusion when converting the artwork into different formats. This series of posts is meant to enlighten artists about colors when digitizing their artworks. In here I define terms and explain the differences between color systems in the digital realm.
The Colors We See
In truth there are more colors than the rainbow. An average human (trichromat) sees about 10 million colors and we view the world in RGB, that is due to the red-green-blue cones in our eyes. A tetrachromat sees a lot more because of the existence of an extra cone. But this ability to see invisible colors are more common in animals or insects. They see UV light or infrared for food and danger detection. Most humans cannot see this light because the lens of our eyes block most light for protection and evolution purposes. Furthermore about 10% of males and 1% of females are color blind, which means that some colors appear dull or desaturated to them.
Fun Fact: Color blindness is prevalent in men because of the X chromosome where color blindness is detected. Men only have 1 X chromosome while women have two. At the same time more women, about 2-3% are true tetrachromats than men.
Not All Colors Are Equal
In the digital realm, colors are much more limited because of well, technology. Each device for capturing, displaying and producing colors have their own standards as well as limitations. For example in the broadcasting world, regulating boards had to be established to dictate globally accepted set of rules when it comes to colors. This is the SMPTE, which stands for Society of Television and Motion Picture Engineers and IEC, or International Electrotechnical Commission. In film workflow, which can be extremely complicated and varied, a similar standards and policies implementor, especially in the United States, would be the Academy of Motion Picture and Sciences, who also developed a standard color space called ACES to be implemented in film production and post production workflows. Other regions in the world like Europe and Asia will likewise have specific standards regulating boards but I will not delve into all of that.
Even more complex would be computers in which several manufacturers have their own recipes of displaying colors, which they then relay to competing brands just to have a common ground for the sake of users. Apple’s display colors will be somewhat different from Windows while Adobe will have its own brand of colors. The Web has a standard set of limited colors that everyone else must adopt. In film including computer visual effects and cinema projection, there is an even more complicated set of rules that I will also not bother to explain here. The diagram shows the differences in the range or gamut of standard color systems. LAB is equivalent to what normal human eyes can see.
Likewise printers and paint manufacturers have their own recipes for inks and paint mixture. But one thing is constant, abbreviated into 3-4 letters. As a general rule, all scanners, cameras screens use RGB because these devices emit light and all printers use CMYK because light is absorbed by the pigments/dyes on typically white physical substrate (i.e. paper). These are what you will call color models.
A Box of Crayons: Color Models and Color Spaces
A color model is a mathematical representation of the colors usually in three or four values or components used by devices in order to read the colors. The relevant examples for artists working digitally would be the additive color model RGB (Red-Green-Blue) for display and capture devices and subtractive color model CMYK (Cyan-Magenta-Yellow-Black) for printing devices. You will also encounter the color model HSL (Hue-Saturation-Luminance), also used for display and capture devices as well as imaging softwares like Photoshop.
An additive color model as seen in the diagram consists of three primaries Red-Green-Blue. When two primaries are mixed, a secondary color is produced. When all colors are mixed, white light is produced. This is the way we humans see the world that digital display and capture devices also follow. If you magnify monitor screens, you will see three components arranged together such as minute LED lights of red, green and blue otherwise known as pixels. When these are fired in combination, all the colors are mixed and then displayed as a cohesive image before our eyes.
Fun Fact: The use of pixels on monitors was influenced by the chromoluminarism as well as pointillism paintings of Georges-Pierre Seurat.
A subtractive color model has the resulting secondaries from the additive model as primaries Cyan-Magenta-Yellow. For example when the magenta and cyan parts of the spectrum are absorbed, the color blue is produced or reflected. Yellow minus cyan is green and yellow minus magenta is red. Subtract them altogether and you get black. This is the model used in printing and likewise in painting, which involves mixing liquid or dry pigments or dyes and then applied onto a substrate such as paper or canvas. Another example is the colored film substrate where light sensitive colored dyes are suspended on a binder onto a cellulose substrate that reproduces colored images when exposed.
White in the additive color model is the emission of all colors whereas black in the subtractive color model is the reflection of all colors.
The HSL model is defined by three relative attributes of all colors, the hue or name of the color, saturation or purity of the color and luminance or brightness or intensity of color.
Color spaces are a more precise description of the values or components of a particular color model. For example in the RGB color model there is Adobe RGB in Photoshop, sRGB for web, ACES (Academy Color Encoding System) for film and a whole lot more.
A simple analogy for color spaces will be a box of crayons where the smallest box will have 8 colors and biggest would be 120 colors. Each crayon has a shape, a name and is labeled.
Sometimes a color like green has many different variants: leaf green, viridian, apple green, etc. The more colors you have in a box, the more vibrant your artwork will be. A color space defines how colors in a color model are organized.
Fun fact: Green has the widest gamut (range) in the visible light spectrum. Humans are most sensitive to the color green largely due to evolution and survival in the wild when our ancestors were still hunter gatherers. The color green is generally associated to vegetation and therefore the existence of food or “greener pastures.” Meanwhile in other cultures, green is also associated with poison, infidelity or Islam.
The Special Sauce: Color Profiles
A color profile is a set of data that is tailor-fitted to a particular device or program, which conforms to the standards implemented by a standard giving body called the International Color Consortium. This data is embedded into the image once it is created or exported to specify the range of colors it has.
An imaging software developer like Adobe has its own variants of special RGB sauce, Adobe RGB (1998) but default to the more widely accepted sRGB IEC61966-2.1 in your workspace. When you look at the ACES graph above, Adobe RGB clearly has a wider gamut (more colors in the “box of crayons”) than the RGB.
Color profiles are assigned as a default by the device that produced the image such as a scanner or a digital camera. In Photoshop when you input and output your image or even create a new blank workspace, you have the option to assign the profile. Sometimes the program prompts you to change or keep the profile when you copy-paste an image that has a different color profile than your workspace. Your choice of color profile will again depend on the final output of your artwork: web or print? Remember that you can convert a bigger color profile into a smaller color profile but not vice versa because color information that is not there cannot be restored.
Likewise a device such as a monitor will have a set of color information stored in its system. When you calibrate or adjust your monitor, the data gathered in that calibration (i.e. brightness, contrast, temperature, etc.) are all stored as a profile that you can use to match your other display devices. Why? Because every color device display colors differently. This is one of the reasons why your image looks different when viewed on your laptop and tablet.
For example, when you go to a computer store to buy your flat monitor, and you look at the merchandise display, you notice that there is a discrepancy in colors at a certain degree even though all devices show the same image. Does it mean that the monitors are defective? No. These are just not calibrated to match and in reality, these will never match because as mentioned earlier, color devices display colors differently. But we can approximate by mixing that special sauce and let the other devices have a taste of it. It is however important to note that calibration is done by experts in color management and that a specialized device is used to measure color information. Automated built-in calibration software in computers are available but not as reliable as a third-party external hardware (i.e. X-Rite or SpyderX).
Printing devices as well as your local printing press will have their own color profiles that follow the CMYK model. It is always best to check with them when bringing in your artwork for mass production.
Practical Use of the Theory
So is it important to know all of these graphs and terminologies? Generally yes. There is a reason why imaging companies invest in color management and consortiums are organized to lay down ground rules for all manufacturers and users to adopt. However it is not necessary to apply them always in your digitized artwork. Take note that the color space and profiles you will be using will depend on the final output. Is the artwork going to be viewed only on the screen (i.e. web) or is it going to be printed? It is always good to pay attention to what is happening in your image to avoid surprises when your neon pink paint do not match the scanned image on your monitor or why your printed image looked duller or darker than what you see on your screen. Perhaps you sent an RGB image to your printer or client who required CMYK? In addition, if you want to get the best color then it is crucial to plan ahead and decide on the appropriate color management to use in your workflow.
In the next blog post, I will ease you into digitizing your artwork, so stay tuned. (to be continued...)