skills.rest
333-333-333
333-333-333COMMUNITY
Explore all skills by this author →
GitHub

flutter-ux-rules

Enforce Flutter UI UX rules for accessibility and consistent components.

Updated Jan 18, 2026
Search Tags:#ui#accessibility#contrast#flutter#ux#spacing#touch-targets
One-click install
npx skills add https://github.com/333-333-333/agents --skill flutter-ux-rules
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: flutter-ux-rules
Source: https://github.com/333-333-333/agents/tree/main/skills/flutter-ux-rules
Command: npx skills add https://github.com/333-333-333/agents --skill flutter-ux-rules

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes assets (resource) components.

What problem does it solve?

Flutter UI development often lacks consistent UX patterns and accessibility compliance across widgets. This skill codifies verifiable rules to ensure tap targets, color contrast, spacing, component states, typography, and accessibility conventions are followed.

Core Features & Use Cases

  • Enforces 48x48 dp touch targets and 8dp spacing
  • Provides a reusable set of UX rules for Flutter components across apps
  • Use case: when designing a new Flutter screen, uplift UI consistency and accessibility by applying these rules.

Quick Start

Review a Flutter screen and apply the UX rules to ensure targets, contrast, spacing, and accessibility meet standards.

Frequently Asked Questions about flutter-ux-rules

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

FAQPage Schema
How do I enforce 48x48 dp touch targets and contrast compliance in Flutter?▼

Enforce 48x48 dp touch targets and contrast compliance in Flutter by applying deterministic UX rules to review widgets and states. This ensures accessible tap targets and color contrast meet standard accessibility requirements.

What is the best way to check Flutter UI for accessibility and spacing grid consistency?▼

Checking Flutter UI for accessibility and spacing grid consistency is done by applying reusable UX rules. These rules verify 8dp spacing grids, component states, and accessibility labeling across widgets.

Does this Flutter UX rules approach work for reviewing existing widgets and colors?▼

This Flutter UX rules approach works for reviewing existing widgets and colors. It applies deterministic checks to screen states and typography to uplift UI consistency and accessibility across projects.

How do I apply consistent UX patterns when creating a new Flutter screen?▼

To apply consistent UX patterns when creating a new Flutter screen, run deterministic checks for touch targets, contrast, and spacing grids. This codifies verifiable rules to ensure accessible components.

Related Skills

Explore More Design & Creative Skills→
sampaio-techsampaio-tech
19

button-system

Generate iOS-style Flutter buttons with customizable sizes, colors, icons, and typography.

Official
Intermediate
QunnnnQunnnn

flutter-improving-accessibility

Configure Flutter user interfaces for assistive technologies and accessibility validation.

Community
Intermediate
Community-AccessCommunity-Access
387

design-system

Validate design system tokens for WCAG AA/AAA contrast, focus, and touch target compliance.

Official
Advanced
ihlamuryihlamury
73

loom-ui-skills

Enforce Loom's UI design system with color tokens, Inter font, and 4px spacing grid.

Community
Intermediate