How do I install the Flutter UI Usage skill?

Run npx skillmds@latest add leancodepl/flutter-ui-usage in your terminal (requires Node.js), paste this page's agent-chat prompt into Claude, Cursor, or any MCP-connected agent, or download the SKILL.md file and copy it into your agent's skills directory.

Is Flutter UI Usage safe to use?

This skill has not completed SkillMD's automated safety review yet. SkillMD never runs a skill's scripts for you; review the SKILL.md before installing.

Which AI agents work with Flutter UI Usage?

This skill is tagged as working with Claude Code, Claude.ai, OpenAI Codex. SKILL.md is an open format, so most agents that read a skills directory can load it too.

Is Flutter UI Usage free to use?

Yes. Installing skills from SkillMD is free, and the skill stays under its author's original license.

Who published Flutter UI Usage?

leancodepl (@leancodepl) published this skill. Their other Agent Skills are listed on their SkillMD profile.

Flutter UI Usage by leancodepl — Agent Skill

Name: Flutter UI Usage
Author: leancodepl

Flutter UI Usage

Explain what the `flutter-ui` plugin does and how to use it. Use when the user invokes `/flutter-ui-usage`, asks what this plugin covers, or needs help with design-system-driven UI, shared loading/error patterns, or presentation-layer localization.

leancodepl b30af8c 2 files · 3.3 KB Updated Sep 17, 2026

File contents

UI Usage

How to respond

If the user invoked this skill without a concrete task, start by explaining what this plugin does and what kind of UI work it is meant for.
Show how to use it through concrete presentation-layer tasks this plugin can handle.
Point to the main UI rule or the dedicated UI skill, and route to sibling plugins when the task becomes state-management, localization, or route-structure specific.
If the user already gave a concrete UI task, briefly explain why this plugin fits and then do the work.
Do not reply with filler like "skill loaded", "ready for the task", or "what would you like to do?" before explaining the plugin.

What this plugin does

Covers design-system-driven presentation-layer implementation in Flutter.
Guides shared loading and error patterns across screens.
Helps keep user-facing text localized and UI state aligned with LeanCode presentation conventions.

How to use it

Ask to build or refactor a page or widget using the existing design system.
Ask to align a screen with shared loading and error patterns.
Ask whether a shared component belongs in the design system or in feature code.
Ask how UI work should connect to localization or page-level state management.

Example requests

"Implement a settings page using existing design-system components."
"Refactor this screen to use the project's loading and error patterns."
"Should this widget live in the design system or stay inside the feature?"

Reach for these assets

references/ui-design-system.md - design-system and presentation-layer UI conventions.
skills/ui/SKILL.md - checklist for implementing or refactoring feature UI.
skills/ui/reference.md - short UI checklist.
Related plugin: flutter-bloc - page state-management conventions.
Related plugin: flutter-localization - localization setup and translation workflow.
Related plugin: flutter-navigation - route-level screen and navigation work.

---name: flutter-ui-usagedescription: Explain what the `flutter-ui` plugin does and how to use it. Use when the user invokes `/flutter-ui-usage`, asks what this plugin covers, or needs help with design-system-driven UI, shared loading/error patterns, or presentation-layer localization.---# UI Usage## How to respond- If the user invoked this skill without a concrete task, start by explaining what this plugin does and what kind of UI work it is meant for.- Show how to use it through concrete presentation-layer tasks this plugin can handle.- Point to the main UI rule or the dedicated UI skill, and route to sibling plugins when the task becomes state-management, localization, or route-structure specific.- If the user already gave a concrete UI task, briefly explain why this plugin fits and then do the work.- Do not reply with filler like "skill loaded", "ready for the task", or "what would you like to do?" before explaining the plugin.## What this plugin does- Covers design-system-driven presentation-layer implementation in Flutter.- Guides shared loading and error patterns across screens.- Helps keep user-facing text localized and UI state aligned with LeanCode presentation conventions.## How to use it- Ask to build or refactor a page or widget using the existing design system.- Ask to align a screen with shared loading and error patterns.- Ask whether a shared component belongs in the design system or in feature code.- Ask how UI work should connect to localization or page-level state management.## Example requests- "Implement a settings page using existing design-system components."- "Refactor this screen to use the project's loading and error patterns."- "Should this widget live in the design system or stay inside the feature?"## Reach for these assets- `references/ui-design-system.md` - design-system and presentation-layer UI conventions.- `skills/ui/SKILL.md` - checklist for implementing or refactoring feature UI.- `skills/ui/reference.md` - short UI checklist.- Related plugin: `flutter-bloc` - page state-management conventions.- Related plugin: `flutter-localization` - localization setup and translation workflow.- Related plugin: `flutter-navigation` - route-level screen and navigation work.

Frequently asked questions