In website design, what are the pros and cons of dark text on light backgrounds vs light text on dark backgrounds, and is one better than the other?
Is it strictly a subjective design choice, or are there marketing and/or psychological UX benefits to choosing light on dark over dark on light?
Black on white is a safe choice.
Even then, we’ve got
- Different opinions
- Different research that uses different methods and leads to different conclusions
Jacob Nielsen suggests:
“Use colors with high contrast between the text and the background. Optimal legibility requires black text on white background (so-called positive text). White text on a black background (negative text) is almost as good. Although the contrast ratio is the same as for positive text, the inverted color scheme throws people off a little and slows their reading slightly”.
In pre-web times, one study failed to find any significant difference in performance among 24 different color combinations in a text search task (Pace 1984). On the other hand, regardless of the specific color combination, higher levels of contrast appear to lead to better readability (Bruce and Foster 1982; Radl 1980).
In a more recent study (Hill 1997?), researchers asked about the subjective perception of various color schemes. Subjects expressed that:
- Black and white were consistently rated as the most readable
- Color combinations that included black were rated more readable than those that did not
- Darker text on lighter backgrounds was rated higher than lighter text on darker backgrounds
I’d like to refer you to an extremely well-written academic paper by Richard Hall. It includes:
- Some further research on retention
- Surprising performance of green on yellow
- Formulas for ensuring enough contrast
Like the article? Please share your opinion in the comments!
About the Author: Ivan Braun is a founder of Icons8. He got his first job after drawing a banner with CTR of 43%. After years of creating icons, he specializes in rapid prototyping and backlog grooming.