Usability testing when you have no research budget
Five participants and an afternoon will tell you more about your product than a quarter of internal debate.
ZooBieDoo Infotech Engineering TeamRead
Key takeaways
- Inverting a palette produces uncomfortable, fatiguing interfaces.
- Elevation on dark surfaces is shown with lightness, not shadow.
- Saturated colours need adjusting for dark backgrounds.
- Support light, dark and follow-system, and remember the choice.
Do not simply invert
Inverting colours produces harsh, high-contrast interfaces that are tiring to read. Pure white text on pure black causes halation, where light text appears to bleed on dark backgrounds.
Use a dark grey rather than black for surfaces and slightly reduced-intensity text. The result is more comfortable for extended reading.
Elevation works differently
In light interfaces, elevation is shown with shadow. On dark backgrounds shadows are nearly invisible, so elevation is conveyed with progressively lighter surfaces — the higher the element, the lighter it is.
Define these surface levels as tokens so components use them consistently rather than each choosing its own shade.
Re-check contrast and colour
- Verify every text and background pair against contrast requirements in both themes.
- Saturated colours that work on white often vibrate on dark surfaces — desaturate them.
- Check status colours remain distinguishable.
- Review images and illustrations, especially those with white backgrounds.
Respect and remember the choice
Default to the system preference, offer an explicit override, and remember it. Support all three states: light, dark and follow-system.
Test the transition too — a flash of the wrong theme on load is a small detail that makes an implementation feel unfinished.
Testing the theme properly
Dark mode defects are easy to miss because most testing happens in the default theme. Add an explicit pass in both themes to the review checklist for any visual change.
Pay attention to the places colour is set outside the design system: charts, embedded content, email templates, PDF exports, third-party widgets and images with baked-in backgrounds. These are where theme support breaks.
Check the loading state as well. A flash of light theme before the preference is applied is a small detail that undermines an otherwise careful implementation.
Frequently asked questions
It depends on ambient lighting and the individual. In dark environments it is more comfortable for many people; in bright ones, light mode is often easier to read. Offering both is the answer.
On OLED displays, meaningfully so for dark content. On LCD screens the effect is negligible.
Modest if built on semantic tokens from the start. Substantial if colours are hard-coded throughout, which is the usual reason it gets deferred.
