Accessibility and Inclusion with Figma

Get an overview of the plugins and utilities for Figma that can help UX designers be more inclusive and accessible with their design work.

Introduction

• Figma accessibility plugins

1. Stark

• Accessibility
• Installing the Stark plugin for Figma
• Using Stark’s contrast checker
• Using Stark’s typography checker
• Reviewing alt text
• Correct focus order
• Using Stark’s vision simulator
• Touch targets
• Adding landmarks
• Add Aria notes
• Using Sidekick
• The Stark accessibility checklist widget

2. Adee

• Installing Adee
• Using Adee’s contrast checker
• Using the alt text generator
• Using Adee’s color blindness simulator
• Checking touch sizes

3. Contrast Checkers

• Installing Able and Ally
• Checking color contrast with Able
• Checking color contrast with Ally

4. Humaaans

• Inclusion
• Using Humaaans with Figma
• Create an onboarding frame
• Persona

5. Lokalise

• An overview of Lokalise
• Changing text to French

6. Inclusivity Sources

• An overview of inclusive design in Microsoft
• Cards for Humanity

Taking Accessibilty and Inclusivity Forward

• Next steps for accessible, inclusive design