plugin87/ux-ui-agent-skills

解决什么问题

让 Agent 生成一个仪表盘，出来的是统计意义上的默认值：靛蓝到紫色渐变、四张没有主次的等高卡片、emoji 当图标、灰字配白底、删除按钮却是蓝色。提示词和仓库里都没有东西告诉它别这么写，事后也没有东西拦住它 —— 审美问题不会让构建失败。这个项目提供的是一层教义加一组客观检查门：真正渲染页面，对上面前几条逐一测量，不合格就让 CI 红掉。

有什么不同

同类思路基本两类：一类是组件库（拿到组件和它的主张，但胶水代码还得 Agent 自己写），一类是提示词/人设文件（上手最便宜，但没人执行）。这个项目走第三条路：纯指令与知识层、无运行时，产出由真正打开浏览器的检查门验收。真正拉开差距的三点：一是检查门对着真实渲染跑 —— 每一种状态的对比度、点击目标尺寸、键盘、reduced motion、280px 下的横向溢出 —— 而不是扫源码文本；二是按意图校验 token，给「删除」标签填一个非危险色相的饱和色就判错，而且刻意不放过没有 token 的页面，因为正是这种页面最容易顺手选色；三是有 slop/品味审计，能标出单一圆角、单一阴影、硬编码数值的产物。138 套设计系统和 52 个组件规范属于内容体量，应当按体量看待 —— 参考资料的广度容易宣称、难以验证。

适合谁

已经在用编程 Agent（Claude Code、Cursor、Codex、Copilot、Aider）、并且希望它的 UI 产出不经人工逐 diff 复审就能过无障碍检查的前端和设计系统工程师。有 WCAG 合规义务或已有公开设计系统的团队收益最大。一次性原型页面、或已经有成熟设计系统且自带强制 lint 规则的团队可以跳过 —— 你等于在一个已经跑起来的体系旁边再放一套教义。它不是 UI 库，不给你可 import 的组件。

上手成本

README 声称无构建工具、无依赖、无运行时，MIT 许可，可经 npm（ux-ui-agent-skills）安装。真正的成本在教义上：把 CLAUDE.md 和 .claude/rules/ 装进项目，意味着这套工具对间距、圆角、阴影和颜色意图的主张变成了评审标准，遇到既有色板时预计要先调掉一批误报。检查门要跑浏览器，CI 会变慢变重。文档异常详尽，还主动检讨了一个曾经跳过未 token 化页面的检查门，这是成熟的信号 —— 但也提醒这套年轻的规则引擎仍有边界情况。v2.10.0 说明迭代很快，建议锁版本。

点评

这是一个全新项目：2026-03-16 创建，一周前还不到 300 star，本周周榜 +896、第 3 名，所以现在的关注是尖峰，还不是成熟用户群。设计上前后自洽，用测试钉住检查门、让子 Agent 盲跑评测的自我审计姿态，比多数 Agent skill 仓库诚实。风险也是这类指令层项目的通病：规则的好坏取决于下一个模型愿不愿意遵守，真正撑住底线的是检查门本身。如果你在意 Agent 写出来的 UI 的无障碍质量，值得在一个仓库里试用；在你自己跑出的检查门全绿之前，别急着推到整个团队。