Design Tool

CONTRAST CHECK

Check if text color is readable on background.

Foreground (Text)

Background

WCAG Compliance

Normal Text (AA)

Pass

Large Text (AA)

Pass

Normal Text (AAA)

Pass

Large Text (AAA)

Pass

Contrast Ratio

21:1

Perfect (AAA)

Normal Text (16px)

Good design is accessible design. Ensure your text is readable for everyone, including users with visual impairments. This is a standard paragraph example.

Large Text (Bold 18px+ / Regular 24px+)

Big Headlines Are Easier To Read.

UI Components

CONTRAST CHECK

WCAG Compliance

Big Headlines Are Easier To Read.

"LOADING"

CONTRAST CHECK

WCAG Compliance

Big Headlines Are Easier To Read.