Back to Plugins
Contrast Checker

Contrast Checker

Check contrast in your UI design

contrastdesignacessibilitycontrastcheckercolorcontrastewcagcoruicheckcolorw3c

Plugin Preview

Contrast Checker preview

About this plugin

Check contrast in your UI design based on Contrast Success Criteria 1.4.3 and 1.4.6 of the Web Content Accessibility Guideline (WCAG).


How it works:

  1. Select colors;
  2. Confirm the colors;
  3. The application will inform you if the contrast is good for normal sized texts and large text (above 18 points);
  4. The reset button clears the interface, but it doesn't need to be pressed for you to recheck.


For informational purposes:

  1. Level A: Bad, ineffective;
  2. Level AA: Good, effective;
  3. Level AAA: Great, excellent.


Created as an object of study.

Plugin Details

Version3
CreatedJanuary 12, 2023
Last UpdatedApril 12, 2023
CategoryAccessibility tools
CreatorLucas Amorim
Stats4205 installs, 161 likes
PricingFree

Technical Details

  • API:1.0.0
  • UI:ui.html
  • main:code.js
  • Editor Types:
    figma