How does it handle complex widgets like modals?

It provides standardized Stimulus controller logic for focus trapping, keyboard navigation shortcuts, and proper ARIA dialog attributes.

Does this skill support Hotwire and Turbo?

Yes, it includes specific patterns for aria-live regions and focus management designed to work seamlessly with Turbo Streams and Frames.

Can it help my Rails app reach WCAG 2.2 Level AA compliance?

Absolutely. The skill is based on WCAG 2.2 Level AA requirements, covering perceivability, operability, and robustness standards.

Is it compatible with Tailwind CSS?

Yes, the patterns include specific Tailwind CSS utility classes for focus rings, screen reader visibility (sr-only), and high-contrast modes.

Accessibility Patterns for Rails

Name: Accessibility Patterns for Rails
Author: Kaakati

byKaakati

•

디자인 도구

Implements WCAG 2.2 Level AA compliant user interfaces in Rails applications using best-practice ARIA, keyboard navigation, and focus management patterns.

소개

This skill equips Claude with specialized patterns to ensure Ruby on Rails applications meet strict accessibility standards. It provides implementation strategies for semantic HTML, ARIA roles, and keyboard-accessible widgets specifically tailored for modern Rails stacks including ViewComponents, Hotwire, and Tailwind CSS. By providing ready-to-use logic for screen reader support and focus trapping, it helps developers build inclusive enterprise-grade applications that comply with WCAG 2.2 Level AA guidelines while maintaining high development velocity.

주요 기능

2 GitHub stars
TailAdmin and Tailwind-compatible focus indicator and contrast patterns
Stimulus-powered logic for focus trapping and roving tabindex patterns
Accessible dynamic content updates via Turbo Streams and live regions
ARIA role and relationship mapping for complex widgets and forms
Comprehensive WCAG 2.2 Level AA implementation reference for Rails UI

사용 사례

Remediating existing Rails UI components to meet accessibility compliance audits
Implementing screen-reader-friendly validation feedback and status announcements
Building accessible interactive components like modals, tabs, and dropdowns

소개

주요 기능

2 GitHub stars
TailAdmin and Tailwind-compatible focus indicator and contrast patterns
Stimulus-powered logic for focus trapping and roving tabindex patterns
Accessible dynamic content updates via Turbo Streams and live regions
ARIA role and relationship mapping for complex widgets and forms
Comprehensive WCAG 2.2 Level AA implementation reference for Rails UI

사용 사례

Remediating existing Rails UI components to meet accessibility compliance audits
Implementing screen-reader-friendly validation feedback and status announcements
Building accessible interactive components like modals, tabs, and dropdowns