skills.rest
takzobye
takzobyeCOMMUNITY
Explore all skills by this author →
Website𝕏@takzobyeGitHub

flutter-accessibility

Configure Flutter accessibility with semantics, keyboard support, and adaptive layouts.

1|Updated Mar 6, 2026
Search Tags:#accessibility#a11y#wcag#flutter#adaptive-layouts#accessibility-testing#semantic-roles
One-click install
npx skills add https://github.com/takzobye/flutter_social_share_plus --skill flutter-accessibility
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: flutter-accessibility
Source: https://github.com/takzobye/flutter_social_share_plus/tree/main/.agents/skills/flutter-accessibility
Command: npx skills add https://github.com/takzobye/flutter_social_share_plus --skill flutter-accessibility

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Ensures Flutter applications are usable by people who rely on assistive technologies and adaptive layouts by providing clear guidance to implement semantics, keyboard/mouse support, adequate contrast, and minimum tap targets across mobile, web, and desktop.

Core Features & Use Cases

  • Semantic Annotations: Use Semantics, MergeSemantics, and explicit SemanticsRole mappings so screen readers and web ARIA expose meaningful UI information.
  • Adaptive Layouts: Prefer LayoutBuilder and MediaQuery.sizeOf for responsive breakpoints rather than hardware checks; constrain widths for readability on large screens.
  • Interaction & Focus: Implement FocusableActionDetector, Shortcuts, FocusTraversalGroup, and MouseRegion to support keyboard navigation and hover states.
  • Validation & Testing: Provide guidance for automated widget tests using accessibility guidelines (tap targets, contrast, labeled elements) to continuously validate a11y compliance.

Quick Start

Enable web semantics at app startup and add Semantics wrappers, minimum tap target constraints, and LayoutBuilder-based responsive widgets so screen readers, keyboard navigation, and contrast requirements are enforced.

Frequently Asked Questions about flutter-accessibility

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I make my Flutter app meet WCAG 2 accessibility standards?▼

To meet WCAG 2 accessibility standards in Flutter, use semantic roles, focus traversal, minimum tap sizes, and contrast guidelines. This ensures screen readers and adaptive layouts function correctly across mobile, web, and desktop platforms.

How do I configure Flutter semantics for screen readers?▼

Configure Flutter semantics by enabling web semantics at app startup and using Semantics, MergeSemantics, and explicit SemanticsRole mappings. This exposes meaningful UI information to screen readers and web ARIA.

What is the best way to build responsive layouts in Flutter for large screens?▼

The best way to build responsive Flutter layouts is using LayoutBuilder and MediaQuery.sizeOf for responsive breakpoints rather than hardware checks. This constrains widths for readability on large screens.

How do I add keyboard navigation and hover support to Flutter web apps?▼

Add keyboard navigation and hover support in Flutter by implementing FocusableActionDetector, Shortcuts, FocusTraversalGroup, and MouseRegion. This ensures full interaction support beyond touch inputs.

Can I automate accessibility testing for Flutter widgets?▼

Yes, you can automate accessibility testing for Flutter widgets by writing widget tests that validate tap targets, contrast, and labeled elements. This continuously validates a11y compliance during development.

Does this Flutter accessibility approach work across desktop and EN 301 549 requirements?▼

Yes, this approach applies accessibility and adaptive design practices across Flutter mobile, web, and desktop projects. It enforces semantics, keyboard support, and contrast to meet EN 301 549 requirements.

Related Skills

Explore More Software Engineering Skills→
333-333-333333-333-333

flutter-widget-testing

Automate Flutter widget rendering, interaction, and accessibility validation tests.

Community
Intermediate
timsvoicetimsvoice

specimin-ui-accessibility

Audit and fix generated UI code for WCAG 2.1 AA compliance.

Community
Advanced
maxkishchenko2015maxkishchenko2015

flutter-adaptive-ui

Automate adaptive Flutter UI design with Abstract, Measure, Branch breakpoints.

Community
Intermediate
FutureAtomsFutureAtoms
1

react-native-2026-accessibility

Implement and test React Native accessibility with WCAG 2.2 compliance.

Community
Advanced