ui-designer
CommunityTurn reference UI images into ready-to-implement prompts.
Authordaymade
Version1.0.0
Installs0
System Documentation
What problem does it solve?
This Skill extracts design systems from reference UI images and translates them into implementation-ready UI prompts, enabling consistent design systems, PRDs, and MVP UI variations aligned with reference aesthetics.
Core Features & Use Cases
- Extract color palettes, typography, spacing, and component styles from reference images
- Generate design system documentation and a PRD for UI projects
- Create implementation-ready UI prompts (themes, variants, components)
- Produce multiple design方案s (mobile and web) and assemble into a final UX prompt
Quick Start
- Gather inputs: reference images and project idea(PRD)
- Generate design system with Task tool and templates
- Create MVP UI prompts and verify in a React environment
Dependency Matrix
Required Modules
None requiredComponents
scriptsreferencesassets
💻 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: ui-designer Download link: https://github.com/daymade/claude-code-skills/archive/main.zip#ui-designer Please download this .zip file, extract it, and install it in the .claude/skills/ directory.