SuperAPI AI 工具集

design-reviewer

设计与创作

查看项目

更新于 10-16 02:32

技能介绍

用途:审查、审计、检查或验证 UI 代码与设计系统的一致性,输出结构化报告。

主要能力:按严重程度分类检查。Critical 检查原始十六进制颜色是否应改用语义 token(如 #013D5B → var(--sds-interactive-primary)),以及无障碍问题(缺少 aria-label、role、仅用颜色传达信息、缺少 focus-visible 样式)。Major 检查间距是否为 8px 倍数(4px 允许用于紧凑内部间距)、交互元素状态覆盖(hover、active、focus-visible、disabled)、暗色模式适配、边框圆角是否为允许值(4/6/8/12px 或 50%)。Minor 检查字体栈、字体平滑、字号模式、过渡动画曲线与时长、图标是否为描边式(默认 18×18px、1.5px 描边、圆角端点)。

使用方式:读取待审查文件,读取设计系统颜色 token(通常为 tokens/colors.css),逐类运行检查,生成报告。参考 references/review-checklist.md 获取完整映射与清单。报告格式包含摘要表、Critical/Major/Minor 发现(含行号、修复建议、原因)以及按优先级排列的建议。

适用场景:需要确保 UI 代码遵循设计系统、支持暗色模式与无障碍标准的前端项目。

限制:资料未提供安装命令、平台支持、收费信息或具体运行环境要求。