Contrast Grid

Test many foreground and background color combos for compliance with WCAG 2.0 minimum contrast.

Include one color per line, with an optional comma-separated label.

Use distinct rows & columns values Use the same rows & columns values
Background Text
#FFFFFF
#F2F2F2
#DDDDDD
#CCCCCC
#888888
#404040
#000000
#2F78C5
#0F60B6
#398EEA
White
#FFFFFF
Text
DNP 1.1
Text
DNP 1.3
Text
DNP 1.6
#F2F2F2
Text
DNP 1.1
Text
DNP 1.2
Text
DNP 1.4
#DDDDDD
Text
DNP 1.3
Text
DNP 1.2
Text
DNP 1.1
Text
DNP 2.6
Text
DNP 2.4
#CCCCCC
Text
DNP 1.6
Text
DNP 1.4
Text
DNP 1.1
Text
DNP 2.2
Text
DNP 2.8
Text
DNP 2.1
#888888
Text
DNP 2.6
Text
DNP 2.2
Text
DNP 2.9
Text
DNP 1.2
Text
DNP 1.7
Text
DNP 1
Charcoal
#404040
Text
DNP 2.9
Text
DNP 2
Text
DNP 2.2
Text
DNP 1.6
Black
#000000
Text
DNP 2
Effective on Extremes
#2F78C5
Text
DNP 2.8
Text
DNP 1.2
Text
DNP 2.2
Text
DNP 1.3
Text
DNP 1.3
Effective on Lights
#0F60B6
Text
DNP 1.7
Text
DNP 1.6
Text
DNP 1.3
Text
DNP 1.8
Ineffective
#398EEA
Text
DNP 2.4
Text
DNP 2.1
Text
DNP 1
Text
DNP 1.3
Text
DNP 1.8
AAA Pass, AAA (7+)
AA Pass, AA (4.5+)
AA18 Pass, Large Text Only (3+)
DNP Does Not Pass
About WCAG 2.0 contrast