Readable Colors

This app helps you find colored backgrounds for white or black text.

This app helps you find colored backgrounds for white or black text.

In the past, there was a good reason for having a lot of black text on white background everywhere. Printing colored background on paper was very expensive.

But now there is no extra cost for having as much color as you want on a computer screen. The only thing you need to worry about is choosing good colors and having enough contrast between the text and its background.

W3C (World Wide Web Consortium) has developed a formula for calculating the contrast ratio between text and background. And based on this formula, they recommend minimum standards.

This app uses the W3C formula to help you find background colors for black and white text. You can quickly scan through virtually all available colors within the specified minimum standard. These colors you can sort by hue, by saturation, or by brightness in the HSV color system. This app also shows you either the Hex color code, or the RGB values, or the contrast ratio for all available colors.

In case you are wondering what are these W3C standards and their formula for calculating the contrast ratio, here is a short summary of their standards that are used in this app:

For normal text less than 18 point and for bold text less than 14 point, the minimum contrast ratio is 7:1. For normal text at least 18 point and for bold text at least 14 point, the minimum contrast ratio is 4.5:1. For logos, decorative text, and large scale text, the minimum contrast ratio is 3:1.

You can find the W3C contrast ratio formula and the description of their standards at the links below:

https://www.w3.org/TR/2008/REC-WCAG20-20081211/#visual-audio-contrast

https://www.w3.org/TR/WCAG20-TECHS/G17.html