菜单
用于 UI 视觉风格选型、风格方向探索、美学参考；当用户提到 UI 风格、视觉风格、glassmorphism、毛玻璃、brutalism、粗野主义、claymorphism、粘土风、neumorphism、新拟态、bento、便当盒布局、minimalism、极简、skeuomorphism、拟物、dark mode、暗色模式、flat design、扁平化、landing page 风格、dashboard 风格时使用。不用于配色/字体/间距等设计系统基础（用 design-system）。
默认使用会先检查来源的 Prompt；你也可以切换为直接命令，或下载本地副本。
决定是否安装前，请先阅读 SKILL.md，以及 SkillsMP 当前展示的配套文件。
基于 SOC 职业分类
用 Codex 或 Claude 帮你安装 复制这段 Prompt，粘贴到 Codex、Claude 或其他助手里，让它检查 Skill 页面并帮你完成安装。
直接命令不会经过审查 Prompt；运行前请先检查来源。
npx skills add https://github.com/SnowBeatRain/skills --skill design-ui-gallery命令会保持在同一行。复制前请横向滚动并检查完整内容。
想先保存到本地？可下载 SkillsMP 当前能够提供的文件。
正在显示 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）。 |
帮助 Agent 快速定位视觉风格方向。当用户说"参考 XX 风格"或"给我几个风格方向"时，提供风格特征描述、适用场景和关键实现要素。
本 skill 负责视觉风格选型。设计系统基础（配色、字体、间距）用 design-system；具体组件实现用目标框架 skill。
读取 references/style-catalog.md，找到匹配的风格方向。
每种风格包含：
按项目类型读取对应参考：
| 场景 | 读取 |
|---|---|
| 落地页 | references/landing-page.md |
| 后台 / Dashboard | references/dashboard.md |
| 移动端 | references/mobile-app.md |
风格确定后，给出关键 CSS/Tailwind 属性方向。具体组件实现交给目标框架 skill。
| 场景 | 读取 |
|---|---|
| 风格目录（全部风格） | references/style-catalog.md |
| 落地页风格 | references/landing-page.md |
| Dashboard 风格 | references/dashboard.md |
| 移动端风格 | references/mobile-app.md |
将此技能应用于所有 uni-app / uniapp / uni-app x / UTS / HBuilderX / DCloud 跨端开发任务；包括 H5、小程序、App、HarmonyOS、鸿蒙元服务、pages.json、manifest.json、uni API、Pinia、条件编译、测试、CI/CD、安全、UTS 插件等场景。
Use when building, modifying, reviewing, upgrading, testing, launching, or troubleshooting Stripe integrations and operations across payments, Billing, Connect, Tax, Treasury, Terminal, fraud, disputes, reporting, SDKs, webhooks, and Stripe AI tooling.
用于设计系统、UI/UX 设计决策、视觉风格定义、配色方案、字体选型、布局模式、间距系统、组件设计规范；当用户提到设计系统、design system、配色、色彩方案、color palette、字体、typography、布局、layout、间距、spacing、圆角、border-radius、阴影、shadow、设计规范、设计令牌、design token、品牌风格、brand style、视觉语言时使用。不用于纯后端逻辑、数据库设计或与 UI 无关的架构决策。