Lightness Contrast

the difference in brightness
between two colors

• Return to: Contrast subtopic list ←

Lightness contrast is the contrast of value
— how light or dark
one color is compared to another.
It is the most fundamental form of contrast in design because
the human eye perceives value differences
before hue or saturation.

Lightness contrast is what
makes text readable,
shapes hierarchy,
and sets tone.

• Reveals text clearly — dark text on a light background, or vice‑versa
• Creates hierarchy — stronger value differences speak first
• Shapes tone — high value contrast feels bold; low value contrast feels soft
• Supports accessibility — especially for users with low vision
• Defines separation — between surfaces, cards, and layers

Lightness contrast is
the backbone of visual clarity.

These phrases give AI precise, predictable direction:

“Increase the lightness contrast between text and background.”

“Lower the value contrast for a softer tone.”

“Keep the lightness contrast consistent across surfaces.”

“Use stronger value contrast for primary actions.”

“Reduce contrast so the background stays quiet.”

Naming value avoids ambiguity
about hue or saturation.

Hue differences (blue vs. red) do not guarantee readability.

Two different colors can have nearly identical lightness values
and therefore blend together.

Lightness contrast is what determines:

• whether text is readable
• whether layers feel distinct
• whether hierarchy is visible at a glance

Hue adds personality.
Lightness adds clarity.

WCAG contrast ratios are based entirely on value,
not hue:

• 4.5:1 for normal text
• 3:1 for large text

But beyond compliance,
value contrast is about comfort:

• too low → strain
• too high → glare
• balanced → readable, calm, intentional

Lightness contrast is both a requirement
and a design choice.

• Color Contrast — the broader category lightness belongs to
• Tone — value contrast shapes emotional temperature
• Hierarchy — contrast determines what speaks first
• Readability — value contrast supports comfort

• Return to: Contrast subtopic list ←

—- _{Tony de Araujo —New York | Lisbon}

• Top↑
• Back to Topic ↔
• Home←