Back to Plugins
Color contrast matrix

Color contrast matrix

Check WCAG contrast compatibility of your whole color palette.

contrastaccessibilitycompliancecontrastcheckercolorwcaga11y

Plugin Preview

Color contrast matrix preview

About this plugin

Need to test your color palette for WCAG 2.1 AA compliance? Not sure which of your color combos are accessible? Enter the hex values of your palette, and this will output a matrix showing the compatibility of EVERY color combination. Red / cross for fail, green / tick for 4.5:1 contrast (AA compliant for all text/UI elements), and yellow / warn for 3:1 contrast (AA compliant for large text/UI elements, but not small text).

Plugin Details

Version1
CreatedJuly 2, 2024
Last UpdatedJuly 2, 2024
CategoryAccessibility tools
CreatorMischa
Stats37 installs, 5 likes
PricingFree

Technical Details

  • API:1.0.0
  • UI:src/ui.html
  • main:src/code.js
  • Document Access:dynamic-page
  • Editor Types:
    figma