Many websites use black text on a light background to display their content because it’s easy to read. However, using white text on a dark backg

When to Use White Text on a Dark Background

submited by

Style Pass

2021-07-15 10:30:08

Many websites use black text on a light background to display their content because it’s easy to read. However, using white text on a dark background also has its advantages. Knowing when to use one over the other will allow you to design your website without hurting user readability.

When it comes to text on websites, users either read or scan. Reading involves focusing on words for a thorough comprehension of the subject. Scanning involves skimming the words for a broader comprehension of the subject. When you should use white text on a dark background depends on whether users are scanning or reading text.

The kind of text that users read is paragraph text. You should avoid using white text on a dark background when displaying paragraph text to make it easier for them to read. Forcing users to fixate on the white text for a long time can strain the user’s eyes. This is because white stimulates all three types of color sensitive visual receptors in the human eye in nearly equal amounts [source]. This makes reading white paragraph text on dark backgrounds stressful on the eyes.

White also reflects all wavelengths of light. Because the words and letters in paragraph text are compact and close together, when white text reflects light, the reflected light scatters and runs into neighboring words and letters. This makes the shape of the words and letters harder to perceive, which affects readability. Compare that with black text, where the black absorbs the light around each word and letter, making them easy to distinguish.