TintSense
Get the plugin
Design Intelligence Pro Feature v1.2.0

Color Vision Simulation

Accurate color vision deficiency simulation backed by peer-reviewed matrix models, rendering spatial comparison cards right on your canvas.

Approximately 1 in 12 men and 1 in 200 women experience color vision deficiency

A color combination that looks vibrant and legible to a trichromatic observer can completely vanish for someone with red-green or blue-yellow color blindness. Standard contrast tools evaluate only mathematical luminance distance without checking whether color blindness collapses the perceptual contrast between your text and background.

TintSense incorporates scientifically validated 3×3 transformation matrices to test whether your text contrast holds up under Protanopia, Deuteranopia, and Tritanopia.

The Scientific Pipeline (Viénot et al. 1999)

TintSense converts sRGB channels into linear space (gamma 2.4 removal), multiplies them by the Viénot 3×3 deficiency matrix, and returns to sRGB. Contrast is then re-evaluated under simulated vision to detect contrast loss:
sRGB (0-255) → Linear RGB → 3×3 Matrix Multiply → Linear → sRGB Output

The Three Simulated Deficiencies

DEFICIENCY TYPES & PREVALENCE CLINICAL COLOR DEFICIENCY PROFILES
Deuteranopia Green-blind (~5% of men)

The most prevalent form. Green and red hues blend into olive and beige tones. Lightness separation is critical.

Protanopia Red-blind (~1% of men)

Reds appear significantly darker and blend into dark grays and browns. Red text on dark backgrounds often fails completely.

Tritanopia Blue-yellow blind (< 0.1%)

Blues look greenish and yellow looks light gray or violet. Rare, but critical for healthcare and transit interfaces.

Canvas CVD Comparison Cards

Instead of burying color blindness warnings inside nested UI dropdowns, TintSense introduces CVD Canvas Cards:

  • Clean Exterior Stacking: Annotation cards stack neatly along the left exterior border of your scanned frame, keeping your artwork completely visible.
  • Simulated Swatches: Each card renders side-by-side simulated color swatches showing how your text and background appear to someone with color blindness.
  • Severity Categorization: Badged as Safe, Borderline, or Risk based on simulated ratio degradation.
  • Plain-Language Advice: Provides practical suggestions, such as "Increase lightness difference rather than relying on hue separation alone."

How to use in Figma

  1. Perform a scan on any frame containing colored buttons, badges, or typography.
  2. Click the Color Vision Cards button (crosshairs icon) in the header.
  3. Inspect the stacked cards beside your artboard to verify that contrast remains robust for every user.