Back to Plugins
Caravage

Caravage

Check easily your design contrast accessibility with the 3.0 Web Content Accessibility Guidelines

contrastcolor

Plugin Preview

Caravage preview

About this plugin

Check easily your design contrast accessibility with the 3.0 Web Content Accessibility Guidelines.


About

Caravage allows you to check easily your design contrast accessibility with the 3.0 Web Content Accessibility Guidelines.


You can either select individually any text layer or scan a selection and the plugin will automatically give you for each text:

  1. The colour(s) of the text.
  2. The colour(s) of the background directly behind the text.
  3. The font size and weight of the text.
  4. The contrast value based on WCAG 3.0 (Web Content Accessibility Guidelines) and the new colour contrast method called APCA (Accessible Perceptual Contrast Algorithm).
  5. The minimum contrast value provided by the APCA contrast look up table.


Credits

  1. This plugin was inspired by another plugin called Contrast.
  2. This plugin use the Accessible Perceptual Contrast Algorithm by Andrew Somers.
  3. This plugin use RGBQuant to analyze the colour(s) of the selected text and the background behind it.
  4. This plugin use Figma Plugin DS, a lightweight UI library.

Plugin Details

Version4
CreatedSeptember 4, 2024
Last UpdatedJanuary 26, 2025
CategoryAccessibility tools
CreatorSimon
Stats47 installs, 6 likes
PricingFree

Technical Details

  • API:1.0.0
  • UI:dist/ui.html
  • main:dist/code.js
  • Document Access:dynamic-page
  • Editor Types:
    figma
  • Allowed Domains:
    • https://rsms.me