我成功是因为我有决心，从不踌躇。——拿破仑

https://github.com/Leonxlnx/taste-skill

当你的 AI 开始有审美：Taste Skill，不想再让界面长成一张“模板脸”

有些项目是来提高效率的，有些项目是来解决问题的，还有一些项目，出现的那一刻就像在对整个行业说一句：

别再丑下去了。

Taste Skill 就是这样一个项目。

它的 GitHub description 写得非常直接，也非常有态度：gives your AI good taste. stops the AI from generating boring, generic slop。而 README 里的定位更进一步，把它定义为：The Anti-Slop Frontend Framework for AI Agents。(github.com)

这句话翻成更有画面感的人话就是：

当越来越多人开始让 AI 帮自己写前端、搭页面、做设计稿、改界面时，Taste Skill 决定站出来，当那个皱着眉头整理领口的人。别人家的 AI 还在忙着堆大圆角、浅阴影、渐变按钮和千篇一律的英雄区，它已经拎着尺子、带着审美表情包、推开门走进来，说一句：

不行，这个太像机器糊出来的了，重做。

它到底是什么

Taste Skill 不是一个传统意义上的 UI 组件库，也不是某个单一框架绑定的模板仓库。它是一套给 AI Agent 使用的可移植技能文件，目的是让 AI 构建出来的界面在布局、排版、动效、留白和层次上更有质感，而不是继续生成那种一眼就能认出来的“AI 味前端”。(github.com)

README 对它的介绍非常清楚：这些技能会升级 AI 构建界面的表现力，让页面拥有更强的布局能力、更好的字体处理、更有克制和目的性的动效，以及更舒服的间距系统，而不是停留在 boilerplate-looking UI 的层面。它还不只包含代码实现类技能，也包含图像生成类技能，用于制作网站、移动端和品牌套件的参考图，然后再把这些视觉参考交给 Codex、Cursor 或 Claude Code 等工具去实现。(github.com)

换句话说，Taste Skill 像一个专门训练 AI 审美和出图手法的设计教练团。它不直接替你做一切，但它会站在 AI 身后，时不时敲一下桌子：

  • 布局别太保守
  • 字号层级别糊成一锅粥
  • 留白不是浪费，是呼吸
  • 动效不是抖一抖就叫设计
  • 页面不能每次都长成同一个 SaaS 模板样

这个项目为什么会让人眼前一亮

因为它骂得很准，也补得很准。

今天很多人都在用 AI 写前端，表面上看热闹非凡，实际上也确实出现了一个很明显的问题：AI 会写页面，但未必真的会做设计。

它会拼模块，会填按钮，会套配色，会摆几张卡片，会在页面顶部放一个大标题，再在下面塞三列功能点。它像一个非常勤奋的实习生，什么都肯做，但一开工就容易做出一种乖巧、无害、完整、却毫无记忆点的网页。页面虽然“完成了”，但不动人，也不高级，不锐利，不克制，没有真正属于项目的气质。

Taste Skill 的价值，恰恰就在这里。

它不是在解决“怎么生成页面”这个问题，而是在解决“怎么让 AI 生成的页面别那么像 AI 生成的页面”。(github.com)

这就很有意思了。因为前者是能力问题，后者是品味问题。而在设计这件事上，往往真正拉开差距的，恰恰不是“能不能做”，而是“做出来有没有味道”。

它像一个不肯让你随便交差的设计总监

Taste Skill 的仓库里并不是只有一个技能，而是一整套分工明确的技能系统。README 把这些技能列得很清楚：有默认主力技能，有 GPT/Codex 更强约束的版本，有图片到代码的流水线技能，有旧项目改版技能，也有偏柔和、极简、工业粗野等不同视觉方向的风格技能，还有专门输出图片参考图的图像生成技能。(github.com)

这个设计特别像一个成熟的设计团队，而不是一个单兵作战的提示词文件夹。

它没有粗暴地说“我有一个万能技能，你全拿去用”。相反，它的态度很像一个经验丰富的创意总监在分配任务：

  • 你要一个最稳妥的默认选择？先用 design-taste-frontend
  • 你特别依赖旧版本行为？那就用 design-taste-frontend-v1
  • 你想要更严格、更猛、更不准页面躺平的 GPT/Codex 风格？那上 gpt-taste
  • 你已经有项目，只是界面太平庸？那用 redesign-existing-projects
  • 你想做极简编辑感？那用 minimalist-ui
  • 你要更冷硬、更机械、更有瑞士排版和实验气质？那用 industrial-brutalist-ui
  • 你想先出视觉参考图，再落代码？那就走 image-to-code 或图像生成类技能路线(github.com)

这不是一个技能，而是一支会分工、会换打法、会看项目气质的“审美小队”。

它最迷人的地方，是它不迷信某个框架

README 的 FAQ 里明确提到，它可以配合 React、Vue、Svelte 等框架使用，因为这些规则瞄准的是设计意图，而不是某个特定框架 API。(github.com)

这点非常重要。

很多所谓设计工具，一旦脱离某个生态就开始失语；但 Taste Skill 不是在教 AI 背某套框架咒语，而是在教它如何理解视觉结构、排版节奏、空间关系和设计方向。它更像是给 AI 装一个“审美操作系统”，而不是只发一本“Tailwind 课堂笔记”。

也因此，它不像在推销组件，而像在传递判断标准。

你用 React 也行，用 Vue 也行，用 Svelte 也行，甚至未来用别的生成方式也行。只要你还在做界面，只要你还在试图让页面脱离“模板感”，Taste Skill 的价值就还在。

它不是只会说“好看一点”，而是真的把审美拆成了可操作的规则

Taste Skill 很聪明的一点，是它没有把“设计感”这种抽象词悬在半空，而是把很多东西拆成可以被 AI 理解和执行的具体策略。

在主技能的设定里，它会先要求 AI 读 brief，推断设计语言，然后调三组关键拨盘：VARIANCE、MOTION、DENSITY。README 里也明确写出了 taste-skill 的三个设置维度，取值范围是 1 到 10：(github.com)

  • DESIGN_VARIANCE：布局实验程度，低一点更居中更干净，高一点则更偏不对称、更现代
  • MOTION_INTENSITY：动效强度，低一点是简单 hover，高一点可以走到 scroll 或 magnetic 级别
  • VISUAL_DENSITY：视窗信息密度，低一点更开阔舒展，高一点更适合信息密集页面(github.com)

这三个参数非常妙。

它们像是设计控制台上的三个旋钮。你不再只是在命令 AI“做个高级点的页面”，而是可以更明确地告诉它：我要这个页面更大胆一点，更有动感一点，更稀疏一点，或者更紧凑一点。

这使得 Taste Skill 的“审美”不是玄学，而是带有一定工程可调性的美学系统。

它像一个会讲究氛围、但又随时拿得出参数面板的艺术指导。

快速上手也很直接，命令比想象中还简单

如果只看使用方式，Taste Skill 并不复杂。README 给出的安装方式非常清楚，核心就是用 npx skills add 把对应技能加进来。(github.com)

最基础的安装方式可以这样写：

1
npx skills add https://github.com/Leonxlnx/taste-skill --skill "design-taste-frontend"

如果你想安装原始 v1 版本，则可以这样：

1
npx skills add https://github.com/Leonxlnx/taste-skill --skill "design-taste-frontend-v1"

如果你想走更严格、更偏 GPT/Codex 的路线，也可以装它的强化版本：

1
npx skills add https://github.com/Leonxlnx/taste-skill --skill "gpt-taste"

如果你想让 AI 先产视觉参考，再去还原代码，那就可以装图到代码技能：

1
npx skills add https://github.com/Leonxlnx/taste-skill --skill "image-to-code"

如果你的场景是改造一个已经存在但不好看的旧项目：

1
npx skills add https://github.com/Leonxlnx/taste-skill --skill "redesign-existing-projects"

如果你已经清楚风格方向，还能继续叠加风格技能：

1
2
3
npx skills add https://github.com/Leonxlnx/taste-skill --skill "high-end-visual-design"
npx skills add https://github.com/Leonxlnx/taste-skill --skill "minimalist-ui"
npx skills add https://github.com/Leonxlnx/taste-skill --skill "industrial-brutalist-ui"

而如果你要的不是代码，而是网页参考图、移动端界面图或品牌板，也有单独的图像生成技能：

1
2
3
npx skills add https://github.com/Leonxlnx/taste-skill --skill "imagegen-frontend-web"
npx skills add https://github.com/Leonxlnx/taste-skill --skill "imagegen-frontend-mobile"
npx skills add https://github.com/Leonxlnx/taste-skill --skill "brandkit"

这些命令看起来很朴素，但背后的意味并不朴素。

因为它意味着，Taste Skill 并不是一个只能围着某个 AI 平台打转的概念，它是真的被组织成了可安装、可选择、可组合、可迁移的技能体系。(github.com)

它连工作流都替你想好了

README 里专门提到了一个非常现实的工作流：image-first。也就是先生成设计参考图，再分析图，再落代码。官方甚至建议在使用 image-to-code-skill 时，可以直接在提示词里说明这条流程，比如：follow the skill: generate images, then analyze, then code。(github.com)

这件事为什么很重要？

因为很多人现在已经发现，纯文本让 AI 直接写页面，经常会出现一个问题：结构对了，气质不对；功能有了，视觉没立住；代码完整了，版面却还是有种“像完成作业”的味道。

而图像优先的流程，本质上是在告诉 AI：先别急着落代码，先把视觉方向站稳。先长出骨相，再去织肌肉。先把这个页面“看起来应该是什么人”搞清楚，再让它“以代码形式出生”。

Taste Skill 对这件事的态度非常务实。它没有执着于“文本提示一定足够”，而是积极拥抱图片参考、图像生成和多阶段实现。这种做法更像真正的设计流程，而不是单轮问答式生成幻觉。

它还会帮你对付 AI 那种“写一半就跑”的坏习惯

README 里有一个技能特别好玩，也特别真实，叫 full-output-enforcement。它的描述直白得像一句吐槽：当模型总是只交半成品时，强制完整输出，不要留 placeholder comments。(github.com)

看到这里真的很容易会心一笑。

因为只要你稍微和 AI 协作过写界面，就会知道这种情景有多熟悉。前面写得热热闹闹，到了关键部分就来一句：

  • 其余 section 按类似方式实现
  • 这里你可以继续扩展
  • 其余卡片略
  • TODO: finish animations
  • Placeholder for footer

这种行为特别像一个一边答应“马上做完”，一边已经在往门口挪的外包同学。

而 Taste Skill 干脆把这个问题做成了一个专门技能，说明它不是只关心视觉风格，它还在认真处理 AI 交付过程中的顽疾。它想要的不是“看起来懂设计”，而是“真的把该交的东西交完整”。

主技能里的很多细节，能看出它对“反模板化”几乎有执念

从主技能 SKILL.md 能看出，Taste Skill 不只是大方向上反对 generic slop，它在具体执行里也有很多很强的约束和检查机制。比如它强调在动手前先读 brief、判断页面类型、受众、气质和可能对应的设计系统语境；还要求做 copy self-audit，在交付前重新检查页面上所有可见文字，从标题、副标题、按钮、正文、alt 文本到页脚都不能敷衍。(github.com)

这件事特别像一个真正做过项目的人写出来的规则。

因为一个页面之所以显得“廉价”，很多时候并不只是因为颜色或阴影，而是因为整页从布局到语言都透着一种没认真想过的气息。标题像空话，按钮像模板默认值，文案像没有目标用户，留白像乱空，动效像没节奏。Taste Skill 的一套规则，其实是在逐步拆掉这些廉价感的来源。(github.com)

它不是只盯着“颜值”，它盯的是完整的界面气质。

不同技能像不同性格的设计师，谁上场要看项目气质

这是 Taste Skill 很值得写的一点：它不是把所有设计风格都搅在一起，而是做成了明确可选的审美人格。

默认主技能像全能型设计总监

design-taste-frontend 是默认推荐起点，README 说它现在是 v2 experimental，做了大幅重写，会读取 brief、推断设计语言、调三组拨盘、加强设计系统映射和预检流程。(github.com)

它像一个经验老到、比较稳、也比较全面的设计总监。它不一定最激进，但它知道怎么不出大错，也知道怎么把页面往更像“作品”的方向拽。

v1 像保守但可靠的老前辈

design-taste-frontend-v1 被保留下来，给那些依赖它原有行为的项目使用。README 说，只有当 v2 默认版本在你的工作流里打破某些关键行为时，再使用 v1。(github.com)

这很像团队里那位老前辈：不追新，但稳，熟，靠得住。

gpt-taste 像脾气更硬的视觉导演

README 里说 gpt-taste 是针对 GPT/Codex 的更严格版本，布局变化更大，GSAP 动效方向更强，反模板化更激进。(github.com)

这位就像设计组里那个不太愿意让版式妥协的人。他看到一个过于规矩的页面，不会说“也还行”，而是会皱眉说：不够开，不够狠，不够拉开气势，再做。

redesign-existing-projects 像 UI 整形医生

这个技能不是从零开始做新页面，而是先审计现有 UI，再去修层级、修间距、修布局、修风格。(github.com)

它特别适合那种“项目不是不能用，但真的不够好看”的场景。它不会一上来推倒重来，而是像一个很懂结构的外科医生，先看片子，再定方案，再逐步把脸从“能看”修到“耐看”。

minimalist-ui 像克制的编辑设计师

README 把它描述为带有 Notion、Linear 气质的产品型极简界面，克制配色、清晰结构。(github.com)

它不是冷淡，它只是很会忍。少说一句、多留一点、收住那些多余表演，让页面显得更成熟。

industrial-brutalist-ui 像冷峻的实验派

这个技能走的是硬机械语言、Swiss type、强对比和实验布局路线。(github.com)

它不是来讨好所有人的，它更像一个有主张的艺术总监，会让页面长出棱角、长出锋利的语气、长出一点工业时代和未来机械感交织出来的张力。

high-end-visual-design 像一个穿羊绒大衣的高级品牌顾问

它偏柔和、克制、昂贵感，强调 softer contrast、更多留白、质感字体和弹性动效。(github.com)

这类页面不会扯着嗓子喊“我很高级”，它只是轻轻坐在那里，你就知道它不便宜。

它连图像生成都不是随便玩玩，而是认真做成生产链路的一部分

README 把图像生成技能单独列出来，并强调这些技能只生成设计图，不输出代码。网站参考图用 imagegen-frontend-web，移动端界面用 imagegen-frontend-mobile，品牌套件看板则用 brandkit。然后，再把这些结果交给 ChatGPT Images、Codex image mode 或其他支持图像生成的 Agent 去出图，最后把图交给代码代理落地。(github.com)

这个思路很成熟。

因为真正做设计的人都知道，视觉探索和代码实现虽然密切相关，但并不是同一件事。Taste Skill 并没有偷懒地把它们混成一个含糊流程，而是明确区分交付物：有的技能出代码，有的技能只出图，有的技能负责串起“先图后码”的整条链路。(github.com)

这种清晰的边界感，恰恰说明它不是“想法很多”，而是真的在构建可执行工作方式。

它甚至在试图建立一种新的 AI 设计协作语言

README 的 FAQ 里提到一个非常关键的概念：SKILL.md。它把这个文件定义为一种便携式指令文件，Agent 可以自动加载，既可以通过 npx skills add 安装，也可以直接复制进仓库或对话中使用。(github.com)

这背后的意义其实很大。

因为 AI 协作最怕什么？最怕每次都从头调教，每次都重新解释风格，每次都靠临时 prompt 堆出一点看运气的效果。而 SKILL.md 这样的机制，等于把经验、规则、约束、气质倾向和交付标准封装成可复用的技能包。

它像是给 AI 发了一份“工作守则”，也像是给团队留下了一套“审美流程资产”。

不再只是今天这位设计师会写 prompt，明天那位工程师会调模型，而是整个团队开始拥有可以传递、可以装配、可以共享的设计能力文件。

这个项目最有意思的地方，是它在和“无聊”作战

很多前端项目的问题不是有 bug，不是不能运行，不是不响应式，而是——无聊。

无聊的英雄区。
无聊的功能卡片。
无聊的间距。
无聊的字体。
无聊的配色。
无聊的三段式首页。
无聊到你明明知道它没错，但就是不想多看一秒。

Taste Skill 本质上是在和这种无聊对抗。

它不接受那种“也能看”“差不多”“用户应该不在意吧”的妥协。它想让 AI 学会一个更难的能力：不是只把页面拼完，而是把页面做得像有人在意过。不是只输出结构，而是输出气质。不是只完成任务，而是建立视觉判断。

你可以把它想成一个有点挑剔、甚至有点毒舌的设计评论家住进了 AI 体内。每次 AI 想偷懒，想再摆一个熟悉的居中大标题加按钮组合，Taste Skill 就会咳一声。

它也很诚实，不假装自己是万能魔法

README 里的说明其实是很务实的。它没有说“装了这个以后，AI 自动成为顶级设计师”。它强调每个技能只做一件事，你不需要一次性全部安装；实现类技能负责输出代码，图像生成类技能负责输出参考图。不同场景就选不同技能，组合也要有方向感。(github.com)

这非常像一个成熟项目该有的样子。

它不承诺神迹，它提供方法。
它不贩卖万能 prompt，它给出技能模块。
它不让你“随便都行”，而是告诉你每种场景应该让谁上场。

一个项目越知道自己解决什么、不解决什么，反而越可信。

从研究到示例，它不是一个空喊口号的仓库

README 里提到，影响这些技能形成的背景写作被放在 research/ 目录中；同时仓库也有 examples/ 和 assets/ 等目录，用来支撑方法论、示例和素材。(github.com)

这点也很加分。

因为“审美”这种词最容易被说空。你随便喊一句“做高级一点”，谁都能喊；但如果一个项目愿意把研究、示例、规则文件和版本演化都公开摆出来，那就说明它不是在卖情绪，而是在积累方法。

甚至 README 里还提到 v1 到 v2 的变化可查看 CHANGELOG.md，并给出了切换建议。(github.com)
这说明 Taste Skill 不是静态作品，而是在迭代、反思、修正和继续打磨的一套系统。

它像一个正在进化中的审美引擎，而不是一次性写完就不管的 prompt 仓库。

如果用拟人的方式来形容 Taste Skill

它像一个终于受不了“AI 页面都长得差不多”的设计总监。

每天它走进办公室，看见满屏大圆角卡片、温吞渐变、毫无个性的文案和不知所云的布局，就会把手里的咖啡往桌上一放，说：

这个界面不是不能用，但它没有灵魂。

它又像一个很懂穿搭的朋友。你让 AI 自己搭，它往往会穿得整齐、得体、标准，但没有风格。Taste Skill 不会把衣柜砸了重来，它只是走过去，把袖口挽一下，把鞋换一下，把层次拉开，把配色收住，然后让整个气质一下子立起来。

它还像一个脾气不坏、但很会盯细节的编辑。

标题俗不俗，它知道。
按钮文案空不空，它知道。
留白是不是只是“没想好所以空着”，它知道。
动效到底是有节奏还是只是晃一下，它也知道。

最重要的是，它愿意把这些“知道”，系统地交给 AI。

为什么说它值得关注

因为它抓住的是 AI 设计时代一个非常真实、非常普遍、也非常烦人的问题。

未来会有越来越多网页、落地页、产品页面、品牌页面、应用界面是由 AI 参与构建的。这几乎已经不是趋势判断，而是正在发生的事实。问题不在于 AI 会不会参与，而在于它参与之后，我们愿不愿意接受一个被“模板审美”统治的互联网。

如果每个人都让 AI 生成页面，而大多数 AI 又都在重复同一种安全答案，那网页世界会越来越像复制粘贴出来的连锁店街区。结构都合理，颜色都干净，代码都能跑，但一眼看过去，全部像同一家店请来的同一个装修队。

Taste Skill 试图阻止的，正是这种审美通货膨胀。

它在做的不是一个小修小补的美化插件，而是在替 AI 前端生成这件事建立一个更高的下限，甚至尝试把上限也往上拽一截。(github.com)

最后

Taste Skill 这个名字很妙。

它没有说自己是 ultimate，不说自己是 premium，不说自己是 intelligent，不说自己是 next-gen。它只说一件事：taste。

这反而最锋利。

因为今天的 AI，很多时候最缺的不是能力，不是速度，不是产量，而是品味。它会做，但未必会选；会拼，但未必会删；会生成，但未必会判断什么该克制、什么该突出、什么该安静、什么该发光。

而 Taste Skill 就像那个站在 AI 身后的审美校准器，告诉它：

不是每个页面都该长成一张模板脸。
不是每个界面都要安全到没有性格。
不是每个设计都应该平庸地“正确”。
真正好的前端，不只会出现，还要会打动人。

如果你已经在用 AI 写界面，如果你已经对那些“看起来像做完了但总觉得少点什么”的页面感到疲惫，如果你希望你的 AI 不只是一个勤奋的切图工，而是一个开始懂版式、懂气氛、懂分寸的搭档，那么 Taste Skill 是一个非常值得认真看的项目。

它不是在帮 AI 变得更吵，它是在帮 AI 变得更有品。

而这，可能正是下一阶段 AI 前端真正稀缺的能力。