Anatomy of Dynamic Color
summary
Dynamic Color extracts a scored source color from a wallpaper by quantizing thousands of colors, then generates five key colors and 13-tone tonal palettes to create a Material 3 color scheme that enforces WCAG contrast by requiring a tone gap (~50) for 4.5:1. It uses the perceptual HCT color space instead of HSL, shifts semantic and brand colors toward the source hue to preserve meaning, and provides tooling (Material Theme Builder and a Figma plugin) to preview and apply schemes; the method was tested and tuned on a real B43 app.
AI-written summary · about
chapters (10)
- 0:00Introduction
- 1:48Dynamic Color background
- 3:57Contrast standards
- 8:58HCT color space
- 10:23Color scheme generation
- 12:27Harmonizing colors
- 14:33Dynamic Color in B43
- 21:55M3 specifics
- 23:19Design flow
- 25:48Summary
related talks
18mMaterial You & Figma: Bringing Dynamic Color & brand together
28mBuilding the Dark Mode of Your Dreams with Color Science
19mWhen colour theory meets technology
28mAdvanced Colors in iOS
39mThe Chroma Zone Engineering Color on the Web
32mInteraction of color systems
45mColours on Time: stronger schemes, fewer headaches
42m“The Interaction of Color Systems”