Accessibility
Define accessibility principles, inclusive design practices, and implementation guidelines in the Tendoo Design System.
Accessibility
Accessibility ensures that all users — regardless of ability — can navigate, understand, and interact with your product. Tendoo’s design system integrates accessibility at every layer to support inclusive, user-friendly, and standards-compliant experiences.
We follow WCAG 2.1 AA guidelines and strive to make accessibility a shared responsibility between designers and developers.
Core Principles
- Perceivable — Users must be able to see or hear your content.
- Operable — UI must be navigable via keyboard and assistive tech.
- Understandable — Content and interaction must be clear and predictable.
- Robust — Works reliably across technologies, devices, and screen readers.
Key Accessibility Practices
| Area | Best Practices |
|---|---|
| Color & Contrast | Ensure 4.5:1 contrast for text; never rely on color alone |
| Typography | Use readable sizes, line height ≥ 1.5 |
| Keyboard Navigation | All interactive elements must be focusable and usable by keyboard |
| ARIA & Roles | Use semantic HTML and apply ARIA only when needed |
| Focus States | Ensure clear visible focus on interactive elements |
| Alt Text | Provide alt for images and descriptive labels for icons |
| Motion | Respect prefers-reduced-motion preferences |
| Forms | Label all inputs, use fieldsets for groups, and show errors clearly |
Example: Accessible Button
<button className="focus:outline-none focus:ring-2 focus:ring-primary">
<span className="sr-only">Submit form</span>
<Icon name="arrow-right" aria-hidden="true" />
</button>Screen Reader Support
Use aria-label, aria-describedby, role, and aria-live attributes carefully to enhance — not overwhelm — the user experience.
<input type="text" aria-label="Search" placeholder="Search" />Tools We Recommend
Related
Accessibility isn’t optional — it’s essential. Tendoo is built to be inclusive by default, so every user can have a high-quality experience, regardless of their abilities.