Repolode
提交项目
smokeeaasd

smokeeaasd/flawless-ui-ux

一套面向编程智能体的 UI/UX 设计技能，用于构建、重设计和审查界面，并附带检查运行页面可访问性与布局问题的 CLI。

在 GitHub 查看
Star
91
Fork
1
未关闭 Issue
0
最近提交
昨天

这是什么？

flawless-ui-ux 是一套技能包，为 Codex、Claude Code、OpenCode、Cursor 等编程智能体提供界面设计指导。它把产品受众、内容和品牌特征与版式、字体、配色、信息密度和交互关联起来，覆盖新界面创建、已有界面重设计、细节优化以及只读的设计审查。

项目还提供一个 npm CLI。它可以收集项目上下文，检查选定的源码文件，或借助无头浏览器检查正在运行的开发服务器页面，输出对比度、无障碍命名、计算字号、横向溢出、图片加载失败和未捕获 JavaScript 错误等信息。保存基线后，修改页面可以重新比对，区分持续存在、新增和已解决的问题。

安装时会把技能复制到各智能体的项目或全局目录，需要 Node 22.12 及以上版本。CLI 的检查属于抽样性质，并不代表完整的 WCAG 合规或视觉质量评估。

核心功能

  • 01支持在现有技术栈中创建、重设计、优化和审查界面
  • 02可安装到十二种受支持编程智能体的项目或全局目录
  • 03检查源码文件和运行中的页面，发现无障碍与布局问题
  • 04对比保存的基线，区分持续、新增和已解决的问题
  • 05提供交互式安装器，也支持通过参数进行脚本化安装

适用场景

  • 让编程智能体按明确的视觉方向搭建新的落地页或仪表盘
  • 审查现有页面的可读性、导航和重复的通用样式
  • 在移动宽度下检查本地开发服务器的对比度不足和横向溢出问题
  • 验证一轮界面修改后问题是否真正消失

快速上手

  1. 1

    使用 npm 将技能安装到项目中

    npx flawless-ui-ux@latest install
  2. 2

    让编码代理使用该技能构建或审查界面

使用前须知

  • 需要 Node 22.12 或更高版本。
  • 基于浏览器的检查需要安装 Playwright Chromium。
  • 检查仅采样少数视口，不能确立完整的 WCAG 合规性。

收录于专题

AI 编程智能体的 UI 设计技能开源 AI Agent 框架与应用AI 编程助手与编码 AgentAI Agent 技能包前端框架与界面组件

标签

#ui-design#ux-design#accessibility#agent-skills#frontend#design-systems#ai-agents#playwright#anti-slop#codex

常见问题

flawless-ui-ux 是什么？
一套面向编程智能体的 UI/UX 设计技能，用于构建、重设计和审查界面，并附带检查运行页面可访问性与布局问题的 CLI。 flawless-ui-ux 是一套技能包，为 Codex、Claude Code、OpenCode、Cursor 等编程智能体提供界面设计指导。它把产品受众、内容和品牌特征与版式、字体、配色、信息密度和交互关联起来，覆盖新界面创建、已有界面重设计、细节优化以及只读的设计审查。
flawless-ui-ux 可以免费使用吗？用的什么许可证？
flawless-ui-ux 以 MIT 许可证开源。用于商业产品前，请先确认许可证条款。
flawless-ui-ux 还在维护吗？
活跃维护中。flawless-ui-ux 最近一次提交是在 2026年11月6日。
flawless-ui-ux 适合用来做什么？
让编程智能体按明确的视觉方向搭建新的落地页或仪表盘 审查现有页面的可读性、导航和重复的通用样式 在移动宽度下检查本地开发服务器的对比度不足和横向溢出问题 验证一轮界面修改后问题是否真正消失
flawless-ui-ux 怎么安装和运行？
使用 npm 将技能安装到项目中: npx flawless-ui-ux@latest install 让编码代理使用该技能构建或审查界面
在哪里获取 flawless-ui-ux？
源代码和安装说明在 GitHub 上：https://github.com/smokeeaasd/flawless-ui-ux

概要由 AI 根据项目 README 生成；GitHub 数据每日更新。

相关项目