Definition
Luminance is the perceived brightness of a colour and the basis of WCAG contrast calculations. It matters for readability and accessibility.
Recompute contrast for your palette in dark mode, since auto-inversion changes it.
Luminance determines contrast, which drives readability and accessibility. Target contrast ratios protect everyone, including low-vision readers. Recomputing for dark mode prevents auto-inversion from breaking it.
Using Contrast
Target a contrast ratio above 4.5 for body text.
Recompute contrast for your palette in dark mode.
Why It Matters
Luminance determines contrast, which drives readability and accessibility. Understanding it ensures your emails are legible for everyone.
Best Practices
- Target a contrast ratio above 4.5 for body text.
- Recompute contrast for your palette in dark mode.
- Use a contrast checker before finalising brand colours.
- Keep text readable over images.
- Review accessibility regularly.
Was this useful?
Related Glossary Terms
Above the Fold in Email
Above the fold in email refers to the content visible to a recipient before they scroll, a critical area for first impressions and primary calls to action.
Accessible CTA (Email)
An accessible CTA is a button or link coded with sufficient colour contrast, visible focus states, descriptive screen-reader text, and a minimum touch target of 44×44 pixels.
Adaptive Design
Adaptive design in email uses predefined layouts that adjust to specific device or client widths, rather than fluidly resizing to every possible screen.
AI-Generated Content in Email
AI-generated content in email is copy, images, code or subject lines produced by artificial intelligence tools to speed up campaign production and testing.
Alt Text
Alt text is the written alternative to an image in an email, displayed when images are blocked, slow to load, or consumed by screen readers.
Autoplay Video in Email
Autoplay video in email refers to the limited ability to play video content automatically when an email is opened, using specific client-supported techniques.
Frequently Asked Questions
It is the basis of WCAG contrast ratio calculations. Luminance determines contrast, which drives readability and accessibility.
Above 4.5 for normal text; above 3 for large text and UI. Target contrast ratios protect everyone, including low-vision readers.
Auto-inverted backgrounds change perceived contrast dramatically. Recomputing for dark mode prevents auto-inversion from breaking it.
Use a contrast checker tool. Luminance determines contrast, which drives readability and accessibility.
A measure of a colour's perceived brightness. Target contrast ratios protect everyone, including low-vision readers.