flutter-accessibility
Implement WCAG 2 and EN 301 549 accessibility standards and adaptive layouts in Flutter apps.
- Enforces semantic annotations, tap target sizes (48x48 dp minimum), and text contrast ratios (4.5:1 for small text, 3:1 for large) across mobile, web, and desktop platforms
- Provides decision logic for web semantics initialization, interactive widget wrapping, screen-size-based layout switching, and keyboard/mouse input handling
- Includes focus traversal management via
FocusTraversalGroupandFocusableActionDetectorfor logical tab order and hover states - Supplies automated accessibility test guidelines to validate compliance with
androidTapTargetGuideline,iOSTapTargetGuideline, andtextContrastGuideline - Prohibits hardware-type checks and orientation locks; requires
LayoutBuilderandMediaQuery.sizeOf()for responsive design
flutter-accessibility-and-adaptive-design
Goal
Implements, audits, and enforces accessibility (a11y) and adaptive design standards in Flutter applications. Ensures compliance with WCAG 2 and EN 301 549 by applying proper semantic roles, contrast ratios, tap target sizes, and assistive technology integrations. Constructs adaptive layouts that respond to available screen space and input modalities (touch, mouse, keyboard) without relying on hardware-specific checks or locked orientations.
Decision Logic
When implementing UI components, follow this decision tree to determine the required accessibility and adaptive design implementations:
More from flutter/skills
flutter-building-layouts
Builds Flutter layouts using the constraint system and layout widgets. Use when creating or refining the UI structure of a Flutter application.
10.7Kflutter-architecting-apps
Architects a Flutter application using the recommended layered approach (UI, Logic, Data). Use when structuring a new project or refactoring for scalability.
10.4Kflutter-animating-apps
Implements animated effects, transitions, and motion in a Flutter app. Use when adding visual feedback, shared element transitions, or physics-based animations.
9.6Kflutter-managing-state
Manages application and ephemeral state in a Flutter app. Use when sharing data between widgets or handling complex UI state transitions.
9.6Kflutter-theming-apps
Customizes the visual appearance of a Flutter app using the theming system. Use when defining global styles, colors, or typography for an application.
9.5Kflutter-implementing-navigation-and-routing
Handles routing, navigation, and deep linking in a Flutter application. Use when moving between screens or setting up URL-based navigation.
9.3K