Colour Contrast Analyser for Web Pages

What is the Colour Contrast Analyser?

Screen shot of the Colour Contrast Analyser

It is a tool for checking foreground & background colour combinations to determine if they provide good colour visibility. Determining "colour visibility" is based on algorithms suggested by the World Wide Web Consortium (W3C):

"Two colours are considered to provide good colour visibility if the brightness difference and the colour difference between the two colours are greater than a set range." The range suggested by the W3C is > 125 for colour brightness and > 500 for colour difference.

Note: Hewlett Packard (HP) provide an online colour contrast verification tool that uses the W3C algorithms, but sets the Colour Difference range at > 400, which results in a greater range of foreground & background colour combinations being deemed acceptable.

Colour Brightness Formula

Colour brightness is determined by the following formula:

((Red value X 299) + (Green value X 587) + (Blue value X 114)) / 1000

The difference between the background brightness, and the foreground brightness should be greater than 125.

Note: This algorithm is taken from a formula for converting RGB values to YIQ values. This brightness value gives a perceived brightness for a colour.

Colour Difference Formula

Colour difference is determined by the following formula:

(maximum (Red value 1, Red value 2) - minimum (Red value 1, Red value 2)) + (maximum (Green value 1, Green value 2) - minimum (Green value 1, Green value 2)) + (maximum (Blue value 1, Blue value 2) - minimum (Blue value 1, Blue value 2))

The difference between the background colour and the foreground colour should be greater than 500.

Uses

The Colour Contrast Analyser (CCA) is useful to help determine, in particular, the legibility of text on a web page and the legibility of image based representations of text.

Assessing conformance with Checkpoint 2.2 of the Web Content Accessibility Guidelines 1.0

Checkpoint 2.2 of the WCAG 1.0 requires that "foreground and background colour combinations provide sufficient contrast when viewed by someone having colour deficits, or when viewed on a black and white screen."

Use the CCA to test colour combinations against the W3C's suggested algorithm for determining "sufficient contrast".

How to Use

More information on how to use and interpret the CCA

Download the Colour Contrast Analyser

Download the CCA

Terms of Use

The Colour Contrast Analyser is Freeware.

By accessing or using the Colour Contrast Analyser, you acknowledge that you have read, understood and agree to be bound by the Colour Contrast Analyser Terms of Use and the Vision Australia Website Terms of Use.

THIS SOFTWARE IS BEING PROVIDED "AS IS", WITHOUT ANY EXPRESS OR IMPLIED WARRANTY. IN PARTICULAR, VISION AUSTRALIA DOES NOT MAKE ANY REPRESENTATION OR WARRANTY OF ANY KIND CONCERNING THE RELIABILITY, QUALITY, OR MERCHANTABILITY OF THIS SOFTWARE OR ITS FITNESS FOR ANY PARTICULAR PURPOSE. ADDITIONALLY, VISION AUSTRALIA DOES NOT GUARANTEE THAT USE OF THIS SOFTWARE WILL ENSURE THE ACCESSIBILITY OF YOUR WEB CONTENT OR THAT YOUR WEB CONTENT WILL COMPLY WITH ANY SPECIFIC WEB ACCESSIBILITY STANDARD.

This work is licensed under a Creative Commons License .