Foreground Color

Background Color

Preview & Results

This is example text. Some of it bolded. Some of it italicized.

Contrast Level

This tool allows you to specify a foreground and a background color by entering the the color RGB hexadecimnal format (e.g. #fd3 or #f7da39) to check if they provide enough of a contrast "when viewed by someone having color deficits or when viewed on a black and white screen"[W3C].

This tool will indicate that the colors pass the test if both the color difference and the brightness difference exceed their threshold. It will indicate that it sort of passes if only one of the two values exceed their threshold. And finally, it'll fail to pass if neither value exceeds its threshold.

This tool will also indicate if the colours pass the newer WCAG 2.0 contrast ratio formula. The WCAG 2.0 formula differentiates between text smaller than 18pt text larger than 18pt (or text that is bold and larger than 14pt). For AA compliance, text should have a ratio of at least 4.5:1 (larger text, at least 3:1). For AAA compliance, text should have a ratio of at least 7:1 (larger text, at least 4.5:1).


Made with by Heiswayi Nrird