Accessibility

Check contrast before it becomes a problem.

Compare foreground and background colors against WCAG ratios and preview them at realistic reading sizes.

Text color
Background color
Contrast ratioExcellent
16.17:1

Passes every WCAG text target.

Advanced APCA analysis
APCA contrastLc 97.1

Preferred for fluent body text Dark text on a lighter background.

Supplemental, polarity-sensitive reading. Use the WCAG ratios above for current conformance checks.

Interface preview

Clear color decisions.

Use contrast that remains comfortable at real reading sizes, not only in a large preview.

Continue
Small supporting copy at 14 pixels.
AA normal4.5:1
Pass
AA large3:1
Pass
UI components3:1
Pass
AAA normal7:1
Pass
AAA large4.5:1
Pass

Saved contrast pairs

Log in to save your contrast pairs.

Next steps

Palette accessibilityAudit every palette pair for contrast and vision conflicts.Color vision simulatorPreview common color-vision differences.Semantic theme builderGenerate light and dark interface roles from one color.Color pickerPick, edit, convert, and save a precise color.