# Flutter Widget > Use when creating, refactoring, or reviewing Flutter widgets, screens, UI components, design-system components, or layout behavior - Skill: `tomevault-io/flutter-widget` (Agent Skill, multi-file: 2 files) - Install (CLI): `npx skillmds@latest add tomevault-io/flutter-widget` - Raw SKILL.md: https://api.skillmd.com/api/skills/tomevault-io/flutter-widget/raw - Safety review: pending (external: skill-scanner PASS, skillspector PASS) - Works with: Claude Code, Claude.ai, OpenAI Codex - Category: Coding & Dev Tools - Author: tomevault-io (https://skillmd.com/u/tomevault-io) - Updated: 2026-09-17 - Page: https://skillmd.com/skills/tomevault-io/flutter-widget --- # Flutter Widget Build UI by following the repository's existing design system and composition style. ## Checklist - Inspect nearby widgets before adding new patterns. - Use existing theme tokens, spacing, typography, localization, and responsive helpers. - Keep widgets small, composable, and theme-aware. - Avoid business logic, networking, persistence, and complex transformations in UI. - Avoid unnecessary `StatefulWidget`; use it only when local mutable UI state is needed. - Prefer composition over broad flag-heavy APIs. - Limit rebuild scope with focused builders/selectors when state changes frequently. - Preserve accessibility, text scaling, loading, empty, and error states. ## Output 1. Existing UI pattern found 2. Widget/component design 3. State and data inputs 4. Rebuild/performance considerations 5. Validation plan --- > Source: [oElberte/dotfiles](https://github.com/oElberte/dotfiles) — distributed by [TomeVault](https://tomevault.io).