With a gray tint background, less light reflects behind the words, making it easier on the eyes. That’s why a better choice for displaying paragraph text is black text on a light background with a tint of gray. Compare that with black text, where the black absorbs the light around each word and letter, making them easy to distinguish. This makes the shape of the words and letters harder to perceive, which affects readability. 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. White also reflects all wavelengths of light.

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

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 it comes to text on websites, users either read or scan. Knowing when to use one over the other will allow you to design your website without hurting user readability. However, using white text on a dark background also has its advantages. Many websites use black text on a light background to display their content because it’s easy to read.

Gray and black background design