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.

Rows

Rows & Columns Use distinct rows & columns values Use the same rows & columns values

Tile Size

S(80×80) M(100×100) L(150×150)

Show

AAA AA AA18 DNP

Background Text	#135D44	#0E4633	#378638	#020907	#34423D	#646E6B	#C0C5C3	#DFE1E0	#F9F9F9	#FFFFFF
#135D44		Text DNP 1.3	Text DNP 1.7	Text DNP 2.5	Text DNP 1.3	Text DNP 1.4	Text AA18 4.4	Text AA 5.9	Text AAA 7.4	Text AAA 7.8
#0E4633	Text DNP 1.3		Text DNP 2.3	Text DNP 1.8	Text DNP 1	Text DNP 2	Text AA 6.1	Text AAA 8.2	Text AAA 10	Text AAA 10
#378638	Text DNP 1.7	Text DNP 2.3		Text AA18 4.4	Text DNP 2.3	Text DNP 1.1	Text DNP 2.6	Text AA18 3.4	Text AA18 4.3	Text AA 4.5
#020907	Text DNP 2.5	Text DNP 1.8	Text AA18 4.4		Text DNP 1.9	Text AA18 3.8	Text AAA 11.5	Text AAA 15.3	Text AAA 19	Text AAA 20.1
#34423D	Text DNP 1.3	Text DNP 1	Text DNP 2.3	Text DNP 1.9		Text DNP 2	Text AA 6	Text AAA 8	Text AAA 10	Text AAA 10
#646E6B	Text DNP 1.4	Text DNP 2	Text DNP 1.1	Text AA18 3.8	Text DNP 2		Text AA18 3	Text AA18 4	Text AA 5	Text AA 5.2
#C0C5C3	Text AA18 4.4	Text AA 6.1	Text DNP 2.6	Text AAA 11.5	Text AA 6	Text AA18 3		Text DNP 1.3	Text DNP 1.6	Text DNP 1.7
#DFE1E0	Text AA 5.9	Text AAA 8.2	Text AA18 3.4	Text AAA 15.3	Text AAA 8	Text AA18 4	Text DNP 1.3		Text DNP 1.2	Text DNP 1.3
#F9F9F9	Text AAA 7.4	Text AAA 10	Text AA18 4.3	Text AAA 19	Text AAA 10	Text AA 5	Text DNP 1.6	Text DNP 1.2		Text DNP 1
#FFFFFF	Text AAA 7.8	Text AAA 10	Text AA 4.5	Text AAA 20.1	Text AAA 10	Text AA 5.2	Text DNP 1.7	Text DNP 1.3	Text DNP 1
AAA Pass, AAA (7+) AA Pass, AA (4.5+) AA18 Pass, Large Text Only (3+) DNP Does Not Pass About WCAG 2.0 contrast

Updating Code…