Contrast Checker

Tool for comparing two colors according to WCAG Accessibility standards.

Contrast Checker

How it works

Basically, it takes two color inputs and calculates its perceived brightness, compares them, and then check if they pass each one of the WCAG standards.

Features

  • Compare two colors based on WCAG standards
  • Swap colors
  • Can either type the hex code, pick from a color picker, or adjust the HSL values
  • There's also the option to pick from the Tailwind default palette

Live Demo

View Live

Future

  • Offer a more appealing design