Dark Mode Masterclass
DARK MODE MASTERCLASS
a comprehensive guide to dark mode Ul
- The Basics
Google recommends using #121212 for background color. They say to avoid pure black (#000000) because Of too high contrast. However. pure black is used by Apple in their dark mode.
Elevate with white
To elevate an element. use white objects with different opacity. Do not elevate with fancy shadows or different dark shades.
Use less saturated colors. Connecting highly saturated colors with dark elements makes your user's eyes bleed and hurt.
Do not invert shadows. They will go frorn black to white and will look cheap and weird. They will becorne a glow, not a shadow.
The biggest trap of dark mode - accessibility. Dark mode is better for the eyes. but only if applied correctly. Mind the contrast!