Willa ADA Checker

Willa CreativeColor Contrast Checker

This tool checks WCAG color contrast only. It does not constitute a full accessibility or ADA compliance audit.

Add at least 2 valid colors to see the contrast matrix.

Color Scheme Preview

Assign Roles

Background

Heading text

Subheading text

Body text

Primary button (bg)

Primary button text

Primary button hover (bg)

Primary button hover text

Secondary button (bg)

Secondary button text

Secondary button border

Border

Tag (bg)

Tag text

Preview

This is a body paragraph at 14px showing how readable the text is on this background color. Multiple lines help evaluate the overall feel.

Sample Tag

Element	Size	Ratio	WCAG	Note
Heading vs background	32px	1.00:1	Fail
Subheading vs background	18px	1.00:1	Fail
Body vs background	14px	1.00:1	Fail	Fails AA at 14px (requires 4.5:1)
Primary btn text vs btn bg	14px	1.00:1	Fail	Fails AA at 14px (requires 4.5:1)
Primary hover text vs hover bg	14px	1.00:1	Fail	Fails AA at 14px (requires 4.5:1)
Secondary btn text vs btn bg	14px	1.00:1	Fail	Fails AA at 14px (requires 4.5:1)
Secondary btn border vs background	UI	1.00:1	Fail	Fails 3:1 UI component threshold
Tag text vs tag bg	10px	1.00:1	Fail	Fails AA at 10px (requires 4.5:1)
Border vs background	UI	1.00:1	Fail	Fails 3:1 UI component threshold