Thinking of designing a website using pure black and white colors?

There are a number of approaches you can take...

Pure black when coupled with white color in UI design can be problematic as it creates too much contrast. Here you’ll find alternative color codes of gray that your designers can use for a palette that’s easier on the eyes.

What can go wrong when you use pure black and white?

58% or more of computer users suffer from digital eye strain (DES)
High color contrast aids readability but strains the user’s eyes after a while
Difference in color brightness (white – 100%, black – 0%) causes overstimulation
Balancing color harmony and contrast needs caution while using 100% of any hue

What does research say:

“Black text on a white background overstimulates the OFF ganglion cells while white text on black background overstimulates the ON ganglion cells.”

In simpler terms:

“White text from a black screen could inhibit myopia, while black text on a white background may stimulate myopia.”

The study advises against reading black text on a white background due to the striking effects of contrast polarity.

What do we do instead?

Alternate colors that can be used instead of pure black (#000000) font, on white (#FFFFFF) background.

#303030 “Design is not just what it looks like and feels like. Design is how it works.” – Steve Jobs	#2B2B2B “Design is not just what it looks like and feels like. Design is how it works.” – Steve Jobs
#1F1F1F “Design is not just what it looks like and feels like. Design is how it works.” – Steve Jobs	#1B1C1E “Design is not just what it looks like and feels like. Design is how it works.” – Steve Jobs

Alternate colors that can be used instead of pure black (#000000) background, with white (#FFFFFF) font.

#303030 “Design is not just what it looks like and feels like. Design is how it works.” – Steve Jobs	#2B2B2B “Design is not just what it looks like and feels like. Design is how it works.” – Steve Jobs
#1F1F1F “Design is not just what it looks like and feels like. Design is how it works.” – Steve Jobs	#1B1C1E “Design is not just what it looks like and feels like. Design is how it works.” – Steve Jobs

Alternate colors that can be used instead of pure black (#000000) font, on white (#FFFFFF) background.

#303030