Skip to content

Chapter 7 of 7

Digital Color, Accessibility, and Practical Design

In digital work, color is described numerically so it can be reproduced exactly. A hex color code is a six-digit hexadecimal number such as #FF5733, where the first two digits represent red, the middle two green, and the last two blue, mapping directly onto RGB. The CSS function rgb(255, 0, 0) specifies pure red, while rgb(0, 0, 0) is black and rgb(255, 255, 255) is white. The HSL model — hue, saturation, and lightness — is often more intuitive for adjustment: hue is an angle on the wheel from 0 to 360 degrees, saturation runs from 0 to 100 percent intensity, and lightness controls brightness. Color depth, or bit depth, refers to how many bits encode each pixel: 8-bit color allows 256 values per channel and roughly 16.7 million colors in 24-bit RGB, while higher bit depths yield smoother gradients.

Reproducing color accurately across devices requires careful management. A color gamut is the complete range of colors a device or model can represent — sRGB (the standard for web and most consumer displays) has a narrower range than Adobe RGB, which itself cannot match the full visible spectrum. ICC profiles standardize how devices interpret color, and the Pantone Matching System assigns unique numbers to specific colors so designers and printers worldwide can reproduce exact hues. In print, process color uses CMYK halftone dots to build a wide range of hues, while spot colors use pre-mixed inks for precise, consistent brand reproduction. Metamerism, the phenomenon in which two samples match under one light source but differ under another, is a frequent reminder that color appearance depends on lighting.

Accessibility and good design practices ensure color serves everyone. The WCAG contrast ratio, defined as the difference in luminance between foreground and background, requires at least 4.5:1 for normal text and 3:1 for large text under Level AA, with stricter 7:1 and 4.5:1 thresholds at Level AAA. Designers should never rely on color alone to convey meaning and should pair color with icons, labels, or patterns to support users with color vision deficiencies. Optical mixing, in which small adjacent dots or strokes of different colors blend visually at a distance, underpins Pointillism, halftone printing, and even modern pixel displays that combine red, green, and blue sub-pixels additively. Practical tools such as Adobe Color, Coolors, Paletton, and Color Hunt help generate harmonious palettes, while contrast checkers like WebAIM and Stark help verify accessibility. Effects such as color vibration, where saturated complements of similar value create uncomfortable shimmering, and duotone treatments, which reduce images to two striking colors, are powerful design choices when used with awareness of their visual impact.

All chapters
  1. 1Foundations of Color: Models and the Color Wheel
  2. 2Color Relationships: Harmonies and Schemes
  3. 3The Properties and Language of Color
  4. 4How We See Color: Perception and Phenomena
  5. 5Color Psychology, Branding, and Cultural Meaning
  6. 6Pioneers and the History of Color Theory
  7. 7Digital Color, Accessibility, and Practical Design

Drill it

Reading is not remembering. These come from the Color Theory deck:

Q

What are the three primary colors in the RGB color model?

The RGB primary colors are Red, Green, and Blue. This is an additive color model used for screens and digital displays, where combining all three at full intens...

Q

What are the three primary colors in the CMYK color model?

The CMYK primaries are Cyan, Magenta, and Yellow, with K representing Black (Key). This is a subtractive color model used in print, where combining all three th...

Q

What is the difference between additive and subtractive color mixing?

Additive mixing (RGB) combines light — adding colors together moves toward white. Subtractive mixing (CMYK) combines pigments/inks — adding colors together abso...

Q

What are secondary colors in the RGB model?

In RGB, the secondary colors are Cyan (Green + Blue), Magenta (Red + Blue), and Yellow (Red + Green). These are formed by combining two primary light colors at...