经常Vibe Coding，或者让小龙虾，爱马仕等Agent生成过网页、网站的小伙伴都知道，那审美品味，简直像一个模子里刻出来的。

最经典的蓝紫配色，居中大标题，渐变色背景，加上圆角卡片，不仅同质化极其严重，看多了你会觉得AI生成的网页风格真的丑。

这个问题的原因很简单，大模型在预训练的时候，学习了太多Tailwind CSS的项目数据，导致设计品味上被严重污染。

但这并不代表说，AI生成不了大气美观，好看有品位的网页。它只是缺少一套标准，或者另外一套答案去作为参考。

今天老马就给大家安利一个实用的SKill技能，让你以后再用AI生成的网页，审美更上一个档次，更有品味。

这个Skill技能叫：Taste Skill，品味技能，它是一套反模板化前端框架，能配合Cursor、Claude Code等AI Agent工具，让AI生成的网页摆脱千篇一律的AI味，产出更具设计品味的前端页面。

Taste Skill的开源地址如下：

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

Taste Skill的核心操作主要分为四点：

Brief Inference（需求推断）：写代码前先分析页面类型、参考链接/截图、目标受众、品牌资产，推断出设计方向再动手，而非直接套模板。

三个可调刻度盘：布局灵活性、动画深度、信息密度（各1-10档可调）。

Anti-Slop硬性禁令：禁止破折号、禁止div拼假截图/假仪表盘等AI常见偷懒套路。

交付前检查清单：AI写完需通过强制质检条目才可输出。

Taste Skill通过先理解意图再设计 + 禁掉AI偷懒特征 + 质检，从底层改变AI输出前端的方式。

下面老马将实测安装一下，然后生成个网页看看到底效果如何。

Taste Skill实测

Taste Skill这个开源项目下有好几个技能，还包括了图像技能，这里就给大家截图主要的：

如果以上你全部都要安装的话，可以直接运行以下命令，或者把命令发给你的Agent，什么小龙虾，爱马仕，Workbuddy，马维斯都是可以的：

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

如果你只是想安装其中某一项技能，那在下面这段命令中，把技能名称“design-taste-frontend”改成某项技能的英文名称即可：

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

老马就默认安装全部技能了，把命令丢给Codex。对了，访问不了github的问题，咱又得啰嗦一句，去给老马的公众号发私信消息，就说需要Watt Toolkit工具，机器人会告诉你怎么做的：

安装完成之后，接下来使用Taste Skill设计一个敦煌文化展示网页，要求尽可能地体现中式之美，像老马这样没有啥审美的，也写不出啥高大上的提示词：

当然，这里其实有点小作弊的嫌疑。因为Codex自带GPT-Image2这款顶级的图片生成模型，所以生成的一些网页配图会好看一些。

不过你的小龙虾或者爱马仕有接入生图模型的话，出来的网页效果也不会太差的。像现在很多Agent产品都会自带生图技能，没有的话你就安装一个。

比如百度的Dumate，腾讯的马维斯，Workbuddy，Qclaw等等，配合上AI生图，能够整体上提升网页的美观度，总比全部是代码生成的要好看多了：

如上图所示就是最终的生成效果，总体来说审美品味还是到位了，网页个别小细节需要继续优化，第一版达到的完美指数大概可以给到60分。

有点奇怪的是，它是做了电脑端跟移动端的自适应的，但移动端的效果明显比电脑端还好，所以进一步跟AI对话调整是少不了的动作。

好了，以上就是今天的分享，欢迎关注、点赞、转发一键三连。有任何问题和需求，请在评论区留言，回见！

对了，老马最近刚创建了一个AI学习交流群，有兴趣进群的小伙伴可以添加老马微信号：immajiabin，添加好友时备注：进群（不备注不通过）。