Accessibility

How to test your product

Run an automated accessibility check (e.g., Stark plugin for Figma, or browser plugin Axe).

Manually test desktop scenarios with keyboard only (no mouse).

Spot-check with a screen reader (NVDA for desktop, VoiceOver, TalkBack for apps).

Checklist for Designers

Colors and visuals

Navigation and interaction

Text and content

Responsive and mobile

Assistive technology and semantics

Consistency and usability

Responsibilities of a designer

Make color contrast AA compliant

Ensure AA color contrast compliance (4.5:1). Make sure the main colors and background groups are available in the semantic palette of the product.

Add intuitive icons to text

Add an icon to components that explains the tone of the message, not only with color but also with a symbol. This applies to all toasts/snackbars and error messages.

Ensure text is readable

For easy readability, use font sizes and colors recommended by our design system and WCAG. 

Apply consistent UX practices

If controls and interfaces have no feedback, or if their clickability or clickable area is not obvious – make it obvious. Analyze all interfaces for navigation elements and make sure they’re consistent.

Prepare for scalability

Analyze the behavior of components during adaptive layout, make sure it can be scaled.