Skip to content
MewixMewix

Contrast Checker

Check WCAG 2.2 contrast for text and UI. Preview samples, swap colors, adjust opacity, apply lightness fixes, and simulate color vision — everything runs in your browser.

How it works

  1. Set foreground and background colors (HEX or visual picker).
  2. Read the live ratio and AA / AAA badges on the preview card.
  3. Adjust opacity or swap colors to test both polarities.
  4. Apply a suggested fix or review color-vision simulations.

Frequently asked questions

WCAG 2.2 contrast ratios. AA normal text needs 4.5:1, AA large text and non-text UI need 3:1, AAA normal needs 7:1, and AAA large needs 4.5:1.

Related tools

Color PickerColor ConverterColor WheelPalette GeneratorPalette from Image