A11y

Skill launch52-ai/flutter-template/.claude/skills/a11y

Template for Flutter mobile applications.

Install

npx -y skills add launch52-ai/flutter-template --skill a11y

Assembled from the repository path, not quoted from the project. Check it against their README if it does not work.

One thing to look at

2 stars2 stars. Stars are a popularity signal and not a quality one, but at this level it is likely that nobody has read this closely except its author, and you would be relying on your own review.

What its author says it does

Copied from the file, not written here

Audit and implement accessibility in Flutter apps. Use when adding semantic labels, testing screen reader compatibility, ensuring WCAG compliance, fixing accessibility issues, or making UI accessible to all users. Covers Semantics widgets, contrast ratios, touch targets, and assistive technology support.

SKILL.md

3.2 KB, as published. Nobody here has run it

a11y - Accessibility Implementation

Make Flutter apps accessible to everyone. Semantic labels, screen reader support, WCAG compliance.

When to Use This Skill

Adding semantic labels to custom widgets
Auditing code for accessibility issues
Testing with screen readers (TalkBack/VoiceOver)
Fixing accessibility violations
Implementing focus management

Quick Reference

The Four Pillars

Perceivable - Semantic labels, contrast ≥4.5:1, text scaling
Operable - Touch targets ≥48dp, focus order, keyboard nav
Understandable - Clear labels, error guidance
Robust - Semantics widget, live regions, proper roles

Key Requirements

Check	Requirement	Test
Contrast	≥4.5:1	`textContrastGuideline`
Touch targets	≥48×48dp	`androidTapTargetGuideline`
Labels	All interactive	`labeledTapTargetGuideline`

Commands

# Audit for accessibility issues
dart run .claude/skills/a11y/scripts/check.dart

# Audit specific feature
dart run .claude/skills/a11y/scripts/check.dart --feature auth

# Generate accessibility test file
dart run .claude/skills/a11y/scripts/check.dart --generate-tests feature_name

Workflow

1. Audit

dart run .claude/skills/a11y/scripts/check.dart --feature {feature}

Look for: Images without semanticLabel, IconButton without tooltip, custom widgets without Semantics.

2. Add Semantics

Use patterns from semantics-guide.md:

Images: semanticLabel property
Icon buttons: tooltip property
Custom widgets: Semantics wrapper

3. Test

Add accessibility tests per testing-guide.md:

await expectLater(tester, meetsGuideline(textContrastGuideline));
await expectLater(tester, meetsGuideline(androidTapTargetGuideline));
await expectLater(tester, meetsGuideline(labeledTapTargetGuideline));

4. Manual Verification

Test with VoiceOver (iOS) and TalkBack (Android). All controls should be announced clearly.

Guides

Guide	Use For
semantics-guide.md	Semantics widget patterns, roles, labels, focus
testing-guide.md	Automated and manual a11y testing
examples.md	Complete accessible Flutter code

Checklist

Images have semanticLabel or ExcludeSemantics
IconButton has tooltip
Custom widgets have Semantics wrapper
Touch targets ≥48×48dp
Text contrast ≥4.5:1
Focus order matches visual layout
Tested with VoiceOver/TalkBack
Accessibility labels use i18n (t.feature.accessibility.key)

Related Skills

/design - Touch targets, contrast (visual aspects)
/testing - Add accessibility tests with other tests
/i18n - Localize accessibility labels