See Tool Interface section below for reference images
Select a color of text using a mouse or keyboard
Pick a color away from the edge of the character border to avoid areas of anti-aliasing. See the text color reference image below.
Select a background color
Pick a color that is adjacent to the foreground text and seems like it would have the lowest contrast with the foreground text. See background color reference image below.
Ex. For light text, choose the lightest color in a gradient or image background
Ex. For dark text, choose the darkest color in a gradient or image background
If the text you're checking does not Pass (AA) for Normal Text, create an issue (see Text has poor contrast below).
1 - Foreground Color Code
2 - Background Color Code
3 - Foreground Color Picker
4 - Background Color Picker
5 - Normal Text Pass/Fail indicator
Colour Contrast Analyser for Windows window
Mac OS X Interface
Colour Contrast Analyser for Mac OS X window
Make sure to provide enough information to identify instances of text with poor contrast.
Your team may wish to list failures for all failings of a certain type of text (list text, navigation text, superscript text, etc.) in one issue.
Text has poor contrast
Description: Text has poor contrast
Describe the type of text (ex. call to action button text has poor contrast) or use actual words as they appear on the page (ex. "THIS IS MORE THAN SUMMER SHOPPING" text has poor contrast)
Since the Colour Contrast Analyser will provide the color codes, it may be useful to provide that information as well (ex. light grey text (#777777) has poor contrast with its white background (#FFFFFF)