What are Claude Code Skills?

Claude Code Skills are reusable prompt templates stored as markdown files in your project's .claude/skills/ directory. They let you codify best practices and common workflows into slash commands that Claude follows consistently.

How do I create a Claude Code Skill?

Create a markdown file in .claude/skills/ with instructions for Claude. The filename becomes the command name — for example, .claude/skills/code-review.md can be invoked with /code-review during a Claude Code session.

Can I share skills with my team?

Yes. Skills stored in .claude/skills/ can be committed to version control so every team member has access to the same standardized workflows. You can also organize skills into subdirectories by category.

What is the difference between project and global skills?

Project skills (.claude/skills/) are specific to the current project and are committed to git. Global skills (~/.claude/skills/) are personal skills available across all your projects.

flutter-ui

New

21Community RegistryGeneralby Flutter Claude Code Contributors

Flutter UI design and implementation agents

Community PluginView Source

Overview

19 specialized agents + 1 patterns skill for end-to-end Flutter development — from Figma design to App Store deployment.

Installation

bash

# Add marketplace
/plugin marketplace add https://github.com/cleydson/flutter-claude-code

# Install everything (recommended)
/plugin install flutter-all@flutter-claude-code

Individual Categories

Category	Install Command	Includes
UI & Design	`/plugin install flutter-ui@flutter-claude-code`	ui-designer, ui-implementer, ui-comparison, design-iteration-coordinator
Architecture	`/plugin install flutter-architecture@flutter-claude-code`	architect, state-management
Platform	`/plugin install flutter-platform@flutter-claude-code`	ios-integration, android-integration, platform-channel-architect, device-orchestrator
Backend	`/plugin install flutter-backend@flutter-claude-code`	rest-api, firebase, aws, graphql
Testing & Perf	`/plugin install flutter-testing-performance@flutter-claude-code`	testing, performance-analyzer, performance-optimizer
Deployment	`/plugin install flutter-deployment@flutter-claude-code`	ios-deployment, android-deployment
Patterns Skill	`/plugin install flutter-patterns@flutter-claude-code`	Widget, testing, performance, security, animation patterns

Agents

Design Pipeline

•flutter-ui-designer — Analyze designs, map to Flutter widget hierarchies
•flutter-ui-implementer — Generate production-ready Flutter UI code
•flutter-device-orchestrator — Manage iOS simulators and Android emulators
•flutter-ui-comparison — Compare implementation vs original design
•flutter-design-iteration-coordinator — Orchestrate full design-to-code loop

Architecture

•flutter-architect — Clean Architecture, project structure, DI, navigation
•flutter-state-management — Provider, Riverpod, BLoC, Redux, GetX

Platform Integration

•flutter-ios-integration — iOS features, Swift/ObjC, permissions, frameworks
•flutter-android-integration — Android features, Kotlin/Java, Gradle config
•flutter-platform-channel-architect — Cross-platform channel design

Backend

•flutter-rest-api — HTTP clients (Dio), JSON serialization, auth
•flutter-firebase — Auth, Firestore, Storage, FCM, Analytics
•flutter-aws — Amplify, Cognito, S3, AppSync, Lambda
•flutter-graphql — graphql_flutter, queries, mutations, subscriptions

Quality & Deployment

•flutter-testing — Unit, widget, integration, and golden tests
•flutter-performance-analyzer — DevTools profiling, bottleneck detection
•flutter-performance-optimizer — Widget, image, list, animation optimization
•flutter-ios-deployment — App Store, TestFlight, code signing, provisioning
•flutter-android-deployment — Play Store, app signing, staged rollout

Patterns Skill

Use /flutter-patterns for quick reference on widget, testing, performance, security, and animation best practices.

Contributing

See CONTRIBUTING.md for architecture details and contribution guidelines.

Install & Usage

Create the skills directory

mkdir -p .claude/skills

Download the skill file

mkdir -p .claude/skills && curl -o .claude/skills/flutter-ui.md https://raw.githubusercontent.com/cleydson/flutter-claude-code/main/SKILL.md

Invoke in Claude Code

/flutter-ui

View source on GitHub

designagent

Frequently Asked Questions

What is flutter-ui?

Flutter UI design and implementation agents

How to install flutter-ui?

To install flutter-ui, create the .claude/skills directory in your project, then run the curl command to download the skill file. Once installed, invoke it in Claude Code with /flutter-ui.

What is flutter-ui best for?

flutter-ui is a community categorized under General. It is designed for: design, agent. Created by Flutter Claude Code Contributors.