How does this skill improve code maintainability?

It actively prevents common anti-patterns such as hardcoded color values, fixed text sizes, and excessive widget nesting, leading to a cleaner and more scalable codebase.

Can it help generate iOS-specific components?

Absolutely. It provides specific guidance for Cupertino widgets and includes logic for adaptive widgets that switch between Material and iOS styles based on the platform.

Is it compatible with the latest Material 3 updates?

Yes, the skill is designed to prioritize Material Design 3 widgets and patterns as the default standard for modern Flutter development.

Does this skill support Flutter for Web?

Yes, while specifically optimized for mobile platforms, the Material Design and 8dp grid principles apply effectively to Flutter web and desktop applications.

How does it handle dark mode implementation?

It enforces the use of theme-based colors via Theme.of(context).colorScheme, which allows the UI to automatically adapt to system-wide dark mode settings.

Flutter UI Design Systems

Name: Flutter UI Design Systems
Author: muheun

bymuheun

•

Mobile Development

Applies professional Flutter design principles, Material Design 3 standards, and Cupertino patterns to build high-quality, cross-platform mobile interfaces.

This skill empowers developers to build production-grade Flutter applications that adhere to both Android's Material Design and iOS's Cupertino guidelines. It provides a structured framework for implementing theme-based color systems, 8dp grid spacing, and adaptive widgets that automatically respond to the host platform. By enforcing best practices like using TextThemes and avoiding hardcoded values, the skill helps eliminate common anti-patterns and ensures consistent, accessible, and maintainable UI code across mobile, web, and desktop environments.

主な機能

01Standardized 8dp grid spacing and Material TextTheme typography

02Automated theme-based color and system-wide dark mode support

03Material Design 3 and Cupertino (iOS) widget integration

04Anti-pattern detection for hardcoded styles and excessive nesting

052 GitHub stars

06Platform-aware adaptive widget implementation patterns

ユースケース

01Implementing platform-specific navigation patterns like BottomNavigationBar and CupertinoNavigationBar

02Refactoring legacy Flutter UI code to follow modern Material 3 standards

03Designing complex cross-platform mobile login and registration flows

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add muheun/claude-code-marketplace skills

For use in Claude.ai and ChatGPT

Download Skill