clone_ui_from_image
CommunityTurn reference images into Flutter UI code.
AuthorDuyen9904
Version1.0.0
Installs0
System Documentation
What problem does it solve?
Clone a UI design from a reference image into Flutter widget code. The image is first thoroughly analyzed to capture layout, colors, typography, spacing, and components, ensuring a pixel-accurate result that aligns with the project's design system.
Core Features & Use Cases
- Thorough image analysis before code generation to map layout, typography, spacing, and components to Flutter widgets.
- Generates Flutter widget code that follows the project's design system and uses the AppColors and AppDimensions tokens.
- Useful for mobile UI handoffs where designers provide an image and developers need ready-to-edit Flutter code.
Quick Start
Submit a reference image to generate a Flutter widget codebase that replicates the design.
Dependency Matrix
Required Modules
None requiredComponents
Standard package💻 Claude Code Installation
Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.
Please help me install this Skill: Name: clone_ui_from_image Download link: https://github.com/Duyen9904/FitForge/archive/main.zip#clone-ui-from-image Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
Agent Skills Search Helper
Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.