What Are the Best Colors for Dark Mode?
Use light text (#e6e6e6 or similar, not pure white) on dark backgrounds (#1a1a2e or #121212, not pure black). Accent colors should be desaturated 10-20% from their light-mode versions. Keep contrast ratio above 4.5:1 for all text.
Recommended Dark Mode Palette
| Element | Color | Why |
|---|---|---|
| Background | #121212 or #1a1a2e |
Dark enough to feel "dark mode" without halation |
| Surface / Card | #1e1e2e or #1f1f1f |
Subtle elevation above background |
| Primary text | #e6e6e6 |
High contrast without pure white glare |
| Secondary text | #a0a0a0 |
Hierarchy distinction, still above 4.5:1 |
| Accent / Link | #6ea8fe |
Desaturated blue, comfortable on dark |
Why Not Pure Black and White?
Pure black (#000000) with pure white (#FFFFFF) creates a 21:1 contrast ratio. On OLED screens, this causes halation: white text appears to glow and bleed into the surrounding black. Research from the Material Design team at Google recommends #121212 as a base dark surface with #e6e6e6 text to keep contrast comfortable (around 13:1).
Desaturate Your Accent Colors
Fully saturated colors vibrate against dark backgrounds and cause eye strain. If your light-mode primary is #2563eb (saturated blue), desaturate it by 15% to approximately #6ea8fe for dark mode. This keeps the color recognizable while reducing visual fatigue.
Test Your Palette
Use the gen8x color palette generator to create dark-mode-friendly palettes, and the contrast checker to verify your text passes WCAG AA (4.5:1) against your background.