用过 AI 写前端的都知道：出来一个看还行，做两个就发现——长得一模一样。
居中布局、圆角卡片、渐变背景、hero 区大标题配副标题，十个网站九个半长这样。AI 生成前端最大的问题不是功能实现不了，是没有品味。
Taste Skill 就是来解决这个问题的。
它是什么
一个给 AI Agent 用的设计品味 Skill，让 AI 生成的界面在布局、排版、动效、间距上脱离"模板感"。支持 Codex、Cursor、Claude Code 三大平台，34k Star，是目前最火的 AI 前端设计 Skill 之一。
核心思路就一句话：给 AI 一套设计规则，而不是让它自由发挥。
三档可调
taste-skill 有三个 1-10 的旋钮：
| 参数 | 作用 |
|---|---|
| DESIGN_VARIANCE | 布局实验性。低=居中干净，高=非对称现代 |
| MOTION_INTENSITY | 动画深度。低=hover 微动，高=滚动驱动+磁性效果 |
| VISUAL_DENSITY | 信息密度。低=宽敞留白，高=密集仪表盘 |
调低三档做出干净克制的 Notion 风格，调高做出大胆实验性的粗野主义风格。
不止一个 Skill
整个项目包含 13 个子 Skill，分成两类：
代码生成类——输出前端代码：
- 默认 taste-skill（v2 实验版，大重写）
- GPT 严格变体（更高布局多样性）
- 图片→代码流水线
- 已有项目 UI 重设计
- 高端柔和 UI / 极简 UI / 粗野主义 UI
- 强制完整输出（不留 placeholder）
图片生成类——输出设计参考图：
- 网站设计稿生成
- 移动端界面设计稿
- 品牌识别板（logo / 色板 / 字体）
图片生成类 Skill 配合 ChatGPT Images 或 Codex 图片模式使用，生成的参考图再喂给代码 Agent 实现。
怎么用
一行命令：
npx skills add https://github.com/Leonxlnx/taste-skill装完直接让 AI 做前端，生成的代码质量会有明显提升——布局不再是千篇一律的居中卡片，排版会有层次感，间距不再凭感觉。
适合谁
- 用 AI Agent 生成前端代码的开发者
- 对 AI 输出的 UI 质量不满意的人
- 需要快速出高质量设计稿的团队
- 想要特定视觉风格（极简 / 粗野 / 高端）的设计师
链接
- GitHub：Leonxlnx/taste-skill
- 官网：tasteskill.dev
- 协议：MIT License
- 平台：Codex / Cursor / Claude Code