Web Design: Grey Text on White Background

By Xah Lee. Date: . Last updated: .

Starting around 2010, more and more websites use grey text on white background, making it hard to read.

Exhibition

macOS software update 2017 12 12 21493
macOS software update 2017-12-12
racket web design grey on white
racket scheme lisp web design, grey on white 2016-12-22
web design gray text on white
grey on white. 2012-08-16

Orange on Gray!

arstechnica screenshot 2012-03-09
Can you read those orange texts? (arstechnica screenshot, )

Greyer and Greyer!

web design gray on white 2013-06-11
grey on white. 2013-06-11
gray on white chrome devtools website 2015-08-05
Gray on white. 2015-08-15 From Google. https://developer.chrome.com/devtools
web design gray text on white openstudiolab 2015-08-15
web design gray on white. 2015-08-15. From http://www.openstudio.fr/lab/jQuery-virtual-tour,67.html?lang=en
web design gray on white projectured.org 2014-03-15
web design gray on white, http://projectured.org/, as of 2014-03-15
web design gray text on white Joe Arms Erlang 2015-10-16
Joe Arms's blog, inventor Erlang language, as of 2015-10-16. [ source http://joearms.github.io/2013/05/31/a-week-with-elixir.html ]

Solarized Color Theme ?= Science

There's a website called Solarize, that focuses on desigining the most readable color theme, supposedly based on science of color contrast. Witness:

solarized text
Solarize website screenshot

Do you find the text easy to read?

Things get worse:

solarized screen
solarized text 2

The Solarized color themes are low contrast, and supposedly works better when your computer display is under sunlight. Maybe so, but it looks terrible indoors.

see also: [contrast rebellion By Zoltán Gócza, Richard Gazdik. At http://contrastrebellion.com/ , accessed on 2013-01-22 ]

see also: How to Calibrate Display/Monitor Color .

BUY
ΣJS
JavaScript in Depth