Mindket
简体中文
English简体中文
登录注册
商店MCP技能计算器学习价格博客
发现
研究313写作59商务95法律13财务33营销175开发1,430效率391教育81陪伴14
帮助与支持
语言
English简体中文

Taste Skill

由 Leonxlnx 制作技能开发
新上架第 2 版 · 更新于
GITHUB 热门12本月第 12 名仓库
星标115k
点赞

概览

Taste Skill，图片 1
‹1 / 3›
Taste Skill，图片 2
‹2 / 3›
Taste Skill，图片 3
‹3 / 3›

Leonxlnx 做的 Agent Skill，给 Claude Code 和 Codex 一套美术方向和开放图库里的图片，并让它们在真实浏览器里检查效果。这样它们做出的网站和应用界面，就不再像千篇一律的 AI 页面。

Taste Skill 是一款 GitHub 上的开源项目，属于开发类，由 Mindket 上架。可免费获取。当前为第 2 版，最近更新于 。按它的 README 从 GitHub 安装。Mindket 的设置说明可在你的 Mindket 账户获取，以 zip 压缩包下载。

速览

用在
  • Claude Code：作为插件安装，放在 taste-skill: 命名空间下
  • Codex：作为插件安装，在新会话里加载
  • 其他智能体：用 npx skills 安装器
  • 框架：React、Vue、Svelte 和纯 HTML 都能用，因为它的规则讲的是设计，不绑定框架
先运行
/plugin marketplace add Leonxlnx/taste-skill
/plugin install taste-skill@taste-skill

平台

Claude Code编程智能体
Codex编程智能体

关于

它是什么

Taste Skill 是 Leonxlnx 写的 Agent Skill，供做网站和应用界面的编程智能体使用，让它们不再拼凑出一个平庸的落地页。它给智能体一个美术方向、来自开放图库的真实图片，以及一个用来检查自己成果的真实浏览器。仓库里只有一个技能：design-taste-frontend。它的 README 说，这个技能源自对 247 个精选网站的研究。

  1. 列出只有这位客户才有的东西
  2. 脚本从 20 种调研过的方向里抽出三种
  3. 用一句话把客户和选定的方向连起来
  4. 用开放图库里注明出处的图片来搭建
  5. 真实浏览器在三种宽度下检查页面
  6. 修掉三个最大的问题，最多三轮

适合谁

用 Claude Code 或 Codex 做网站或应用界面、希望每一个都像专为客户设计的开发者和独立创作者。没有设计师的自由职业者和小工作室，从它这里获益最多。

谁在用，怎么用
行业谁在用怎么用例子
自由网页设计没有设计师的自由职业者按抽到的美术方向、配上注明出处的图片给客户做网站自由职业者给一位摄影师做作品集网站，并把它找来的每张图片的出处一并交给客户。
博物馆与文化公益机构志愿者和小团队用博物馆藏品里的公有领域艺术作品做页面志愿者用博物馆藏品里的公有领域艺术作品做一个展览页面。
SaaS 与数据产品产品团队用针对应用界面的流程给仪表盘、管理后台和设置界面排版产品团队给一个数据分析仪表盘排版，再用它那套针对应用界面的检查逐项测量。
网页代理公司和工作室接手已有网站的开发者先在真实浏览器里审查页面，再重新设计开发者先让它审查客户的页面，不做任何改动，然后再重新设计。

快速原型不适合用它，因为完整跑一次既慢又耗很多 Token。

用在哪里

Leonxlnx 写了三种装法：Claude Code 插件、Codex 插件和 npx skills 安装器。

  • Claude Code：作为插件安装，放在 taste-skill: 命名空间下
  • Codex：作为插件安装，在新会话里加载
  • 其他智能体：用 npx skills 安装器
  • 框架：React、Vue、Svelte 和纯 HTML 都能用，因为它的规则讲的是设计，不绑定框架
  • 浏览器：电脑上装好的 Chrome、Edge 或 Chromium 负责运行检查

从 2.1 版起，它还能分清网页和应用界面，两者各走一套流程。

两种界面
界面这套流程给它什么
网站页面一个抽出来的美术方向、注明出处的图片，以及三种宽度下的检查
仪表盘、管理后台或设置界面素净的面板和对齐的数字

如何设置

点“获取”会把一个装有 Mindket 安装说明的 zip 压缩包存进你的下载文件夹。技能本身从 Leonxlnx 的仓库安装。

先准备好这些
需要说明
Node22 或更高版本，npx skills 安装器需要 22.20 或更高版本
浏览器电脑上装好的 Chrome、Edge 或 Chromium
API 密钥不需要
联网只有找图时才需要
  1. 解压工具包，打开 setup/claude-code.md 或 setup/codex.md。
  2. 在 Claude Code 里运行下面两条插件命令。
  3. 用 Codex 的话，在终端里运行那两条 codex 命令，然后开一个新的 Codex 会话。
  4. 要更新时，在 Claude Code 里运行 /plugin update，或者重新安装一次。
/plugin marketplace add Leonxlnx/taste-skill
/plugin install taste-skill@taste-skill
codex plugin marketplace add Leonxlnx/taste-skill
codex plugin add taste-skill@taste-skill

说明里还附有 README 中的 npx skills 命令，以及 install.sh 这条路线：它会链接一份克隆，所以用 git pull 就能原地更新。

如何使用

用平常的话让智能体做一个页面或应用界面。在 Claude Code 里，这个技能放在 taste-skill: 命名空间下，所以不会和你的其他技能冲突。测量交给脚本来做。

背后的脚本
脚本它做什么
draw.mjs从 20 种调研过的方向里抽出三种
assets.mjs在开放图库里找图，并附上出处
lint.mjs扫描源码里被禁用的写法
inspect.mjs按 1440、768 和 390 像素宽度打开页面并测量

示例

你只用一段需求，要一个单页网站。

Build a one-page site for a small sourdough bakery in Lisbon that opens at 7 a.m. and sells out by noon.

智能体会说出它抽到的方向，以及页面背后的一句话构想。它列出找来的每张图片，附上作者、许可和来源，说明每条署名放在页面的哪里，并指出上线前要替换的示例内容。截图存在 .taste-skill/inspect/，下载的图片放进 assets/，记录写在 assets/credits.json。

新手与专家

新手：美术方向指的是整体的视觉风格，字体、颜色、图片和布局都围绕同一个主题来挑选。这个技能会给你的页面选定一个方向，并在真实浏览器里检查效果，检查过了才算完工。先从一个单页网站开始，主题选你很熟悉的东西。

专家：关卡跑的是脚本，所以每一轮卡住的禁用写法都是同一套，而方向和点评仍由模型决定。inspect.mjs 会测量字号、实际加载的字体、对比度、溢出和页面边距，所有 FAIL 都要清掉，点评才会开始。每一轮视觉检查只修最严重的三个问题，最多三轮。

node <skill>/scripts/lint.mjs <source files or folder>
node <skill>/scripts/inspect.mjs <url or path/to/index.html>

CC BY 和 CC BY-SA 许可的图片需要它写好的署名，所以要把署名留在页面上。

注意事项

完整做一次要花时间，在你的电脑上运行，只有找图时才连到外面。

  • 时间和 Token：README 估计完整做一次约需 30 到 45 分钟，消耗几十万个 Token
  • 你的电脑：脚本用 Node 运行，会操控你本地的浏览器
  • 它写的文件：项目里的 .taste-skill 文件夹存放工作文件，图片放进 assets/
  • 抽取记录：保存在 ~/.taste-skill/history.json，可以用 TASTE_SKILL_HISTORY 改到别处
  • 图片来源：Openverse、Wikimedia Commons、芝加哥艺术博物馆和大都会艺术博物馆，只提供允许商用的许可
  • 使用数据：npx skills 安装器会发送匿名使用数据，除非你设置了 DISABLE_TELEMETRY=1 或 DO_NOT_TRACK=1
  • 没有代币：Taste Skill 没有发行任何官方代币或加密货币
  • 许可证：MIT

README 和文件

README
# Taste Skill：安装说明

这个工具包里只有 Mindket 写的安装说明，没有别的。技能本身要从 Leonxlnx 的仓库安装，地址是 https://github.com/Leonxlnx/taste-skill

许可证：MIT，Copyright (c) 2026 Leonxlnx。来源见 https://github.com/Leonxlnx/taste-skill/blob/main/LICENSE

由 Leonxlnx 制作，由 Mindket 上架。

## 安装的内容

一个 Agent Skill：design-taste-frontend。它给编程智能体一套美术方向和来自开放图库的真实图片，并在真实浏览器里按三种宽度检查页面。仪表盘和应用界面有单独的一套流程。

技能文件夹里有在你电脑上用 Node 运行的脚本：draw.mjs、assets.mjs、lint.mjs、inspect.mjs 和 scenes.mjs。

来源见 https://github.com/Leonxlnx/taste-skill/blob/main/README.md 和 https://github.com/Leonxlnx/taste-skill/blob/main/skills/taste-skill/README.md

## 开始之前

- Node 22 或更高版本
- 装好的 Chrome、Edge 或 Chromium
- 不需要 API 密钥。找图需要联网。
- npx skills 安装器就是 npm 包 skills。它在注册表里的条目要求 Node 22.20.0 或更高版本，来源见 https://registry.npmjs.org/skills/latest
  它的 README 说这个 CLI 会收集匿名使用数据。设置 DISABLE_TELEMETRY=1 或 DO_NOT_TRACK=1 即可关闭，见 https://github.com/vercel-labs/skills#telemetry

## 主安装命令

下面这条命令出自 README，见 https://github.com/Leonxlnx/taste-skill/blob/main/README.md

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

## 各智能体的说明

- setup/claude-code.md：npx skills、Claude Code 插件，或链接安装的本地克隆
- setup/codex.md：Codex 插件、npx skills，或链接安装的本地克隆

## 更新

README 说再运行一次安装命令即可，因为安装名称没有变。Claude Code 插件用 /plugin update 更新。链接安装的克隆用 git pull 更新。

## 卸载

README 没有给出 npx skills 或插件的卸载步骤。用 install.sh 链接的克隆，可以用这个脚本的 --uninstall 命令取消链接，每份智能体说明里都写了这一行。

## 它会写入的文件

- 项目里的 .taste-skill/：工作文件、方向说明表，以及 .taste-skill/inspect/ 里的截图
- 项目里的 assets/：下载的图片，出处记录在 assets/credits.json
- ~/.taste-skill/history.json：抽取记录。删掉它即可重置，或设置 TASTE_SKILL_HISTORY 换个位置存放。

来源见 https://github.com/Leonxlnx/taste-skill/blob/main/skills/taste-skill/README.md 和 https://github.com/Leonxlnx/taste-skill/blob/main/skills/taste-skill/SKILL.md
文件
README.md  2 KB
setup/claude-code.md  2 KB
setup/codex.md  2 KB

3 个文件，共 6 KB，以 zip 压缩包下载。

更新内容

  • 第 2 版 · 2026-11-09

    Updated by Mindket to the current version of this kit.

  • 第 1 版 · 2026-11-03

同类产品对比

同一分类里与本产品共有主题最多的已上架 GitHub 项目。

产品星标活跃度语言许可证最近更新
Taste Skill 本页115,072活跃JavaScriptMIT
Open 3D Skills共有 frontend · cursor · codex266活跃JavaScriptMIT
Kubai Icons共有 design-system · codex · agent-skills814活跃JavaScript—
UI UX Pro Max共有 landing-page · codex · claude-code146,944活跃PythonMIT
Agent Skills 工程技能包共有 cursor · codex · agent-skills116,705活跃JavaScriptMIT
Graphify共有 cursor · codex · ai-agents144,528活跃PythonApache-2.0
数据为 Mindket 在 2026-11-06 至 2026-11-14 期间读取的数值。 活跃度依据各项目在 GitHub 上的最近更新：30 天内为活跃，180 天内为更新较少，超过 180 天为久未更新。

评价

还没有评分

写评价

还没有评价。

大家怎么说

Hacker News、Bluesky、X、Reddit、Facebook 和 YouTube 上提到这个项目的帖子和评论，来自每周一次的搜索和 Trendshift。它们不是 Mindket 写的，也未经核实，点开即可在原帖处阅读。

steveharing1Taste Skill: An Anti-Slop Front End Framework for AI Agents3 分GitHub Trending JS/TS🎉 Celebrating！ 🎉 (500+ new stars) 📦 Leonxlnx / taste-skill ⭐ 100,985 (+678) 🗒 JavaScript Agent skills that give coding agents taste: art direction, reference images and a browser check instead of generic AI pages1 赞 · 1 条回复Wpnx330Ask HN: How can you tell a site/app is vibe coded?I've been using two open-source tools to prevent, and then check this on my own sites / projects. They are actually pretty good at spotting and they are community driven so they get updates regularly. 1. Impeccable (github.com/pbakaus/impeccable) — a CLI that scans HTML/CSS/JSX for 59…GitHub Trending JS/TS🎉 Celebrating！ 🎉 (500+ new stars) 📦 Leonxlnx / taste-skill ⭐ 107,647 (+760) 🗒 JavaScript Agent skills that give coding agents taste: art direction, reference images and a browser check instead of generic AI pages1 条回复cocoflunchyLaunch HN: Bloomy (YC S26) – AI-powered mastery learning for K-12I think 383toast is talking about your landing page design which has very strong AI-generated design vibes (blue-green gradients, rounded rectangles with a colored border on the left...) There are a bunch of skills you can find online to improve on this if you want to keep designing with Claude,…GitHub Trending JS/TS🎉 Celebrating！ 🎉 (500+ new stars) 📦 Leonxlnx / taste-skill ⭐ 104,234 (+704) 🗒 JavaScript Agent skills that give coding agents taste: art direction, reference images and a browser check instead of generic AI pages1 条回复ルーティわたしが足を止めたのは、今の版を作る過程での、作者さん自身の検証記録ですぅ。 同じ依頼を「スキルなし」「別のスキル」「Taste Skill」で作らせて、別のAIに匿名で採点させる。これを5回、改良しながら回しています。 平均点がスキルなしを上回った回は、5回中ゼロ。最終回でも7.7対7.8で、勝ちは3件中2件でしたぁ。 https://github.com/Leonxlnx/taste-skill/blob/main/skills/taste-skill/references/research.md1 条回复ルーティ一次ソースはGitHubのオープンソースですぅ。中身はただの「おしゃれにして」というお願い文じゃなくて、ちゃんと組まれた術式でしたぁ。 ・20の方向性から、スクリプトが3つをくじ引きで配る ・実際のブラウザで描画して、禁止パターンを計測する ・スクショを見て直す、を最大3周 https://github.com/Leonxlnx/taste-skill1 条回复AI ParabellumTaste Skill made Claude Code's landing pages look less generic. Same coffee shop brief, run with and without it. Free, MIT licensed, made by Leonxlnx. Header links overlapped the photo in one run. aiparabellum.com/taste-skill-...@prosperflowio.bsky.socialThis skill makes your coding agent stop shipping generic AI landing pages and start designing like it has taste. 🔗 github.com/Leonxlnx/taste-skill Credits: github.com/Leonxlnx/taste-skill #tasteskill #javascript #agentskillsVritraSec • GitHub Feed🚀 GitHub Intelligence Drop awesome-mcp-servers (Unknown • 🟢) ⭐ 96.3K → https://github.com/punkpeye/awesome-mcp-servers taste-skill (JavaScript • 🟢) ⭐ 95.5K → https://github.com/Leonxlnx/taste-skill ⚡ Only signal. Zero noise.

搜索日期

Mindket 的更多商品

查看 Mindket 的全部商品

DeepSeek-R1-GGUF

unsloth · 工具包

671B 参数 DeepSeek-R1 推理模型的 GGUF 版本，带 1.58-bit 和 2-bit 动态量化，可在内存足够的本机上用 llama.cpp 运行。

新上架

Axion-1.0-35B-GGUF

prithivMLmods · 工具包

提供 Axion-1.0-35B 的 GGUF 文件，这是一个有约 30 亿激活参数的 35B 混合专家模型，面向科学推理、信息查找和工具使用。适合配合 llama.cpp 在本地使用。

新上架

HEART

Phips · 工具包

用一个超分辨率网络放大低分辨率图像，可以在一块消费级 GPU 上训练，并导出为 ONNX。适合训练或运行图像放大模型的人。

新上架

相似项目

查看开发类的全部商品

Open 3D Skills

Moh4696 · 技能

用八个技能教编程智能体搭建 3D 和动画网站，从 three.js 场景、滚动影片，到透明视频、跟随光标的角色和爆炸视图。适合网页开发者。

新上架266

Graphify

graphify-labs · 技能

将代码库、文档和技术文件转换为可供 AI 编程助手搜索的知识图谱。它利用本地 AST 解析来映射代码、文档和配置之间的关联。

新上架145k

Agent Skills 工程技能包

addyosmani · 技能

Addy Osmani 的开源工程技能集，给 AI 编程智能体用。每个技能是一份 Markdown 工作流，带步骤、检查和结束条件。安装说明涵盖 Claude Code、Codex、Cursor、Gemini CLI、Copilot 等。

新上架117k