Perception

Perception is a Figma plugin designed for product designers who need to check contrast and accessibility in their designs before handoff. 2 guidelines at both AA and AAA levels. The tool addresses challenges that arise with gradients, images, layered fills, and blending modes by using dominant colour detection, aiming to provide results that reflect what users actually see rather than just analyzing solid backgrounds.

The plugin allows users to select any frames, components, or layers in their Figma files and run bulk scans for contrast issues. It detects both text and icon elements, calculates contrast ratios by analyzing foreground and background colours, and provides a pass, warning, or fail breakdown for each element. Users can filter results by status, view the exact colours and contrast ratios, and see the WCAG level associated with each finding. Perception also enables designers to jump directly to any failing node for targeted fixes and supports individual re-testing of specific elements without the need to re-run the entire scan. Additional features include context-aware detection, the ability to switch between colour formats (HEX, RGB, HSL, HSB), and warnings for small-text readability.

99 per month, which adds features for design system work, such as more control over flagged issues, access to all features, priority support, and further customization options. The plugin is particularly useful for those working with design systems, component libraries, or large files with many variants. It is intended as a pre-handoff checker to catch contrast issues early, though it does not replace comprehensive quality assurance with real content and devices.

Perception is delivered as a Figma plugin and is positioned as a tool for improving accessibility and contrast compliance in digital design workflows.