What colors to choose for displaying blocks of texts on a colored background?

I know, that color of the background and of the text should have enough contrast to each other. That rule in mind, blue (#0000ff) text on red (#ff0000) background should be fine. But I get the feeling that’s not good. What should be considered, for choosing colors for text and background? Does it change anything, if the background actually is a color gradient?

Answer

that color of the background and of the text should have enough contrast to each other … blue (#0000ff) text on red (#ff0000)
background should be fine.

Absolutely not! 😀 Your instinct it is right to say that it doesn’t feel right.

What you need it is to learn a bit about theory of colours.
Interaction of Color (Book)Google book link
Color-theory-for-digital-displays-a-quick-reference
http://www.colorsontheweb.com/colorcontrasts.asp

I do not suggest to go for Hue contrast normally they are awful combinations because they are too vibrant colours. It is much better go for Brightness and Saturation contrast, or at least mix the Hue contrast with the Brightness and Saturation.

When you choose your colours make quick check of the contrast by transforming your coloured design in a desaturated way (black, grey and white) and check how well readable it is (you can achieve it with Photoshop or some browser addon). Try with your Red and Blue and you will see.

Here some link for testing contrast (it is a pity that you cannot select the value):
http://www.rotorbrain.com/foote/interactive/hacks/colorinteraction1.html
http://www.rotorbrain.com/foote/interactive/hacks/colorinteraction2.html

And do not forget you have to consider that exist people with color blindeness as well, so it is important to chose your colours right.

Attribution
Source : Link , Question Author : Mnementh , Answer Author : Littlemad

Leave a Comment