用途：frontend-audit 用于把目标设计稿（goal PNG）与运行中的前端页面渲染做视觉比对，适合“匹配这个设计”“按设计稿迭代”“检查实现是否走样”等场景。
首次使用：技能会检查当前目录是否有 .frontend-audit.json；没有则进行 bootstrap，一次性配置开发服务器 URL、目标图目录（默认 design/）并选择是否立即安装依赖。JS 依赖安装命令为：bun add -d pngjs jpeg-js playwright && bunx playwright install chromium（按项目包管理器替换 bun）。区域检测默认使用 OmniParser（需 Python 3.10+），会创建虚拟环境并下载模型，合计约 3GB；也可用 --programmatic 走纯 JS 的 Sobel + 连通域回退，生成较快但标签是位置式名称。
主要流程：discover.mjs 遍历目标图目录并用 SHA-256 判断状态（new/stale/up-to-date/unhashed）；为每张图编写区域描述（分数坐标 x/y/w/h，语义化 kebab-case 命名），可选用 bootstrap-regions.mjs 预生成区域，再用 bind-selectors.mjs 把 locator 绑定到真实 DOM；sample-colors.mjs 采样主色，inspect-shape.mjs 检查圆角、边框、背景模式与阴影，check.mjs 读取实时页面的 getComputedStyle；最后 snap.mjs 传入 --goal 生成 side-by-side 及头/中/尾三段缩放差异图，需逐张阅读。
限制：需要本地开发服务器与 Chromium/Playwright；OmniParser 首次部署约 3GB 且其 icon_detect 为 AGPL，需注意项目许可策略；未安装 Python 或模型下载受限时只能使用回退模式；Python 在 Windows 上需用户自行安装。资料未提供收费与授权细节。