Design.md 网页设计提取

要解决什么问题

把现有网页整理成可给人和模型用的设计说明时，手抄色板、字号和布局既慢又容易漏。Design.md Extractor 针对用户明确给出的 URL 或本地 HTML 路径，在本地用确定性规则抽取页面样式与结构线索，输出 design.md（面向阅读与后续提示）和可选的 design-snapshot.json（留证与排错），全程不调用大模型 API，也不把页面内容上传到外部服务。

工作方式与核心步骤

技能目录内通过 scripts/extract-design.mjs 驱动抽取；若缺少 node_modules/playwright，需先在本目录执行依赖安装。脚本从 bundled 的 lib/design-extractor-core 加载核心逻辑，用 Playwright 加载页面后按规则采样 DOM/CSS，再生成文档。常见 macOS 浏览器路径会自动探测；若 Playwright 找不到浏览器，可显式传入可执行文件路径。默认流程是：确认输入 → 运行抽取脚本 → 优先同时写出 design.md 与 design-snapshot.json → 在汇报前人工扫一眼 design.md 是否合理。

失败时应区分是导航、浏览器、采样、依赖安装还是生成阶段的问题，并回报具体错误，便于对症处理。需要理解快照结构或改抽取行为时，可参考技能内的 references/snapshot-schema.md 与 references/extraction-rules.md。

适用边界

• 只分析用户提供的 URL 或文件，不会顺链爬取其它页面。
• 不推断登录态、隐藏层等页面上未可见的状态。
• 产出的 design token 是实用起点，不能替代手写的品牌规范全书。