夜雨聆风让 AI 帮你搭 landing page，描述写得很具体，生成出来却像同一个模子刻的：紫色渐变背景、Inter 字体、居中 hero、三个 icon 并排——业内管这叫 slop（糊出来的通用货）。你改 prompt，它换一套 slop；再改，还是 slop。
Taste Skill 是一组开源 Agent Skill，专门治这个。装进去之后，AI 写前端时会按 skill 里的设计规则走：更强的排版、间距、动效和层次，而不是默认那套「能看就行」的 boilerplate。MIT、约 3.7 万 Star，默认的 design-taste-frontend 已是 v2（实验版），维护者在持续迭代。
我扫了一圈「让 AI 少出丑页面」的方案，Taste Skill 是我会先装来试的那套——不是因为它功能多，而是 一行命令挂 skill，前后对比肉眼可见。
先看效果
在 Cursor、Claude Code 或 Codex 里跑：
npx skills add https://github.com/Leonxlnx/taste-skill
CLI 会扫描仓库里的 skills/ 目录，把 design-taste-frontend（默认）装进你的 Agent 环境。之后你再让 AI「做一个 SaaS landing page」或「重做这个页面的 hero 区」，它读到的就不只是你的 prompt，还有 skill 里写死的反 slop 规则：禁止千篇一律的紫渐变、限制 Inter 滥用、要求先推断设计语言再写代码，还有 GSAP 动效骨架、 redesign 审计流程等。
画面就是：同一句需求，装 skill 前像 Bootstrap 模板站，装 skill 后 spacing、字重、动效层级都上来了——不是魔法，是把「别出 generic slop」写进了 Agent 的指令层。
一句话说就是：一行 npx skills add，AI 做的页面终于不像紫渐变模板了——排版和间距能看出来是有人管过的。
小编实测，指令内容：AI 笔记工具 SaaS landing page，深色主题。
三个旋钮，专治「AI 审美」
它真正的爽点是 把模糊的「好看一点」变成 Agent 能执行的参数。默认 skill 顶部有三个 1–10 的 dial（在 SKILL.md 里改数字即可）：
- ✦DESIGN_VARIANCE：布局实验度（低=居中干净，高=不对称/现代）
- ✦MOTION_INTENSITY：动效深度（低=hover，高=滚动/磁吸）
- ✦VISUAL_DENSITY：信息密度（低=留白多，高=仪表盘型）
这是我留下它的理由：大多数设计 prompt 是一次性的，模型下一轮就忘。Skill 文件落盘、Agent 每次加载，等于给 AI 配了常驻的设计总监——而且框架无关，React/Vue/Svelte 都能用。
另外两点顺带提：仓库里不止一个 skill——gpt-taste 给 GPT/Codex 更严的规则，redesign-existing-projects 适合改老项目 UI，minimalist-ui / industrial-brutalist-ui 等是不同视觉方向；还有 imagegen-frontend-web 等只出参考图、再交给 coding Agent 实现的流水线。但那是进阶，不是今天要你记住的点。
我的判断：谁该试，谁别碰
值得现在就试的人：用 Cursor / Claude Code / Codex 做前端或 landing page、受够紫渐变 slop 的独立开发者和小团队；愿意花 15 分钟装 skill、用同一个 brief 做前后对比的人。对你们来说，npx skills add 成本低，回报是少改三四轮「再好看一点」。
先别碰或要留个心眼的情况：纯后端、不写 UI 的人——这是前端审美 skill，跟你关系不大；期待「装完所有页面自动变 Apple 官网级」——skill 质量取决于你的 brief 和模型，Garbage In Garbage Out；v2 还在实验期（README 写明 actively iterating toward v2.0.0 stable），行为可能随版本变，要稳定可 pin design-taste-frontend-v1。
还得诚实说一句：最近 push 在 2026-05-26 左右，发版节奏不如 CLI 工具密；效果因模型而异，GPT 系可试更严的 gpt-taste。个人维护项目，无大厂背书，以仓库与 https://tasteskill.dev 为准。
门槛： 低～中 · 需 Node.js（npx）+ 支持的 coding Agent；不绑付费订阅，skill 文件 MIT 可自托管复制。
怎么开始
零安装先看示例（约 5 分钟）打开 https://github.com/Leonxlnx/taste-skill#examples 看 README 里的 before/after 图，确认是不是你想治的那种 slop。
装默认 skill（约 10 分钟）
- ✦在项目根或 Agent 工作区跑：
npx skills add https://github.com/Leonxlnx/taste-skill - ✦只装一个：
npx skills add https://github.com/Leonxlnx/taste-skill --skill "design-taste-frontend" - ✦也可直接把
skills/taste-skill/SKILL.md复制进项目或粘贴进对话
做前后对比（约 20～30 分钟）
- ✦用同一句 brief（如「做一个 AI 笔记工具 landing，深色主题」）让 Agent 生成页面——先不装 skill 看一版，再装 skill 生成一版
- ✦打开 SKILL.md，把三个 dial 各调一档（如 VARIANCE 从 3 改 7），再生成一次，感受布局差异
- ✦老项目改 UI：改用
--skill "redesign-existing-projects"
今天只要完成「装 skill + 同一 brief 前后对比」一次，30 分钟内就能判断值不值得常驻；成功标准：下次做页面你会先 npx skills add 而不是反复改「不要紫色渐变」那句 prompt。卡在某一步，留言 Agent 名称 + 报错前半句。
项目地址
- ✦项目名称：Taste Skill
- ✦GitHub：https://github.com/Leonxlnx/taste-skill
- ✦官网：https://tasteskill.dev
- ✦Star：约 3.7 万（截至 2026-06-08）
- ✦许可：MIT（以仓库 LICENSE 为准）
- ✦关键词：Agent Skill、vibe coding、前端设计、anti-slop、Cursor、Claude Code、GSAP、UI 审美
vibe coding 把「能跑」的门槛踩到地上，「能看」却还没跟上——大家开始用 skill 给 Agent 补审美，而不是靠第 N 版 prompt 碰运气。
如果你正在用 AI 做 landing page 或组件库、且受够千篇一律的 slop，建议花半小时装 skill 做一轮 before/after。
如果你觉得今天的内容有帮助，点击上方账号名片关注我，每天更新精选开源项目，让你少走弯路。
