Optical Effects

Color Intervals and Transformation

The musical analogy — color relationships as intervals that transpose consistently

Key Insight

Albers drew an analogy between color relationships and musical intervals. Just as a chord can be transposed to a different key while maintaining its internal relationships, a set of color relationships can be shifted to different hues while preserving the same visual effect. This principle underlies theming, dark mode, and brand color variants — the relationships between colors matter more than their absolute values.

Key Points

  • Color intervals: the perceptual distance and relationship between colors in a set
  • Transposition: shifting a set of colors to a different key while preserving the intervals
  • What creates a color effect is the relationship between colors, not the specific hues
  • Theming (light/dark mode) is a color transposition — same intervals, different key
  • Brand variants (seasonal, regional) should preserve color relationships to maintain feel

Guidelines

  • When creating dark mode, preserve the contrast relationships between colors — not the colors themselves
  • Brand color variants should preserve the interval between primary, secondary, and accent colors
  • Test: if you shift the entire palette to a different hue, does the design retain the same feel?
  • Semantic color relationships (primary darker than secondary) must be preserved across themes

Want to learn this interactively?

Experience hands-on experiments and test your understanding.

Start Learning
🔥

Practice this topic

Active recall — strengthens long-term retention

Related Topics