Accessibility Spell

About this plugin

Ensure your Figma designs meet accessibility standards with instant WCAG color compliance checking. Accessibility Spell analyzes color contrast ratios, identifies potential accessibility issues, and helps you create inclusive designs that work for everyone.

🎨 Color Detection & Analysis

1. 🔍 Deep Scan: Automatically detects colors from selected elements, children, and nested containers.
2. 🧪 Smart Extraction: Identifies color variables, styles, and raw fills/strokes.
3. 🌈 Gradient Support: Full support for linear, radial, and conic gradients.
4. 🔄 Live Updates: Color list refreshes automatically when you change your selection.
5. 🗂️ Layer Hierarchy: Visual indentation shows exactly where colors are applied in the tree.

♿ WCAG Accessibility Compliance

1. ✅ Instant Validation: Check if colors meet WCAG 2.2 AA and AAA standards.
2. 📏 Text Size Awareness: Accurate ratings for both normal and large text contrast.
3. 🔄 Interactive Checker: Compare any two colors with live WCAG ratios.
4. 📊 Detailed Analytics: View contrast ratios against white and black backgrounds.

📊 Documentation & Simulation

1. 🖼️ Visual Samples: Create professionally styled color cards with accessibility information.
2. 📄 Contrast Matrix: Generate comprehensive contrast grids on a dedicated page.
3. 👁️ Color Blindness Simulation: Preview how colors appear with Protanopia, Deuteranopia, and Tritanopia.
4. 🗛 Personalized Output: Toggle exactly what information appears on your color samples and matrix.

⚙️ Customization

1. 🔧 Flexible Settings: Configure sample/matrix density (compressed, balanced, spacious) and detail level.
2. 🎵 Magical Audio Cues: Magical sound feedback for generation (optional toggle).
3. 🔠 Formatting: Transform color names into Title, Sentence, lower, or UPPER case.
4. 🌍 Full Localization: Complete English and Spanish support across the entire UI and generated documentation.

Perfect for ensuring design system accessibility, WCAG compliance audits, and creating inclusive user experiences.

Part of the 🪄 Design Tokens Wizards toolkit!

www.designtokenswizards.com