design-ui-gallery
用于 UI 视觉风格选型、风格方向探索、美学参考；当用户提到 UI 风格、视觉风格、glassmorphism、毛玻璃、brutalism、粗野主义、claymorphism、粘土风、neumorphism、新拟态、bento、便当盒布局、minimalism、极简、skeuomorphism、拟物、dark mode、暗色模式、flat design、扁平化、landing page 风格、dashboard 风格时使用。不用于配色/字体/间距等设计系统基础（用 design-system）。
소스 정보
- 저장소
- SnowBeatRain/skills
- 최근 소스 활동
- 2026년 5월 27일 02:48
- 감지된 SKILL.md 언어
- 중국어
- 스타
- 2
- 포크
- 0
설치 방법
기본적으로 소스를 먼저 확인하는 Prompt가 선택됩니다. 직접 명령으로 전환하거나 로컬 사본을 다운로드할 수도 있습니다.
소스 파일 검토
설치 여부를 결정하기 전에 SKILL.md와 SkillsMP에 표시된 보조 파일을 읽어 보세요.
파일 탐색기
5 개 파일SKILL.md 표시 중
SKILL.md
소스 지침 · 읽기 전용 미리보기- name
- design-ui-gallery
- description
- 用于 UI 视觉风格选型、风格方向探索、美学参考；当用户提到 UI 风格、视觉风格、glassmorphism、毛玻璃、brutalism、粗野主义、claymorphism、粘土风、neumorphism、新拟态、bento、便当盒布局、minimalism、极简、skeuomorphism、拟物、dark mode、暗色模式、flat design、扁平化、landing page 风格、dashboard 风格时使用。不用于配色/字体/间距等设计系统基础（用 design-system）。
# Design UI Gallery Skill
## 意图
帮助 Agent 快速定位视觉风格方向。当用户说"参考 XX 风格"或"给我几个风格方向"时，提供风格特征描述、适用场景和关键实现要素。
本 skill **负责视觉风格选型**。设计系统基础（配色、字体、间距）用 `design-system`；具体组件实现用目标框架 skill。
## 触发场景
- 用户要求某种视觉风格（毛玻璃、粗野主义、极简等）。
- 需要探索多个风格方向做选择。
- 需要了解某种风格的关键实现要素。
- 落地页、后台、移动端 App 的整体视觉方向选择。
## 工作流
### 1. 确认需求
1. 项目类型：落地页 / 后台 / 移动端 / 展示站。
2. 品牌调性：专业 / 友好 / 科技 / 文艺 / 大胆。
3. 目标用户群体。
4. 参考风格关键词。
### 2. 风格探索
读取 `references/style-catalog.md`，找到匹配的风格方向。
每种风格包含：
- 特征描述
- 关键要素（色彩、形状、动效）
- 适用场景
- 代表案例
- Tailwind / CSS 关键属性
### 3. 应用场景参考
按项目类型读取对应参考：
| 场景 | 读取 |
|---|---|
| 落地页 | `references/landing-page.md` |
| 后台 / Dashboard | `references/dashboard.md` |
| 移动端 | `references/mobile-app.md` |
### 4. 实现方向
风格确定后，给出关键 CSS/Tailwind 属性方向。具体组件实现交给目标框架 skill。
## References
| 场景 | 读取 |
|---|---|
| 风格目录（全部风格） | `references/style-catalog.md` |
| 落地页风格 | `references/landing-page.md` |
| Dashboard 风格 | `references/dashboard.md` |
| 移动端风格 | `references/mobile-app.md` |
GitHub에서 보기