（8643期）Extract Design System – 一键提取网站设计系统，生成 Token 启动文件

一键提取网站设计系统，生成 Token 启动文件 从公开网站提取设计系统原始数据（色彩、字体、间距等），生成项目本地的 Token 启动文件，适合快速初始化设计系统。 使用说明 核心用法 extract-design-system 是一款基于 Playwright 的命令行工具，用于逆向工程公开网站的设计原语。用户只需提供目标 URL，工具便会自动抓取并解析页面的视觉样式，生成结构化的 Token 文件。工作流程包括：安装 Chromium 依赖、执行提取命令、审查归一化数据、按需生成启动文件。支持两种模式：仅提取原始数据（--extract-only），或完整生成项目可用的 Token 文件（init）。 显著优点 快速启动：无需手动测量或逐页审查，自动化提取显著缩短设计系统初始化周期。 结构化输出：提供 raw.json（原始抓取数据）、normalized.json（归一化语义 Token）、tokens.json（项目级配置）及 tokens.css（CSS 变量），覆盖设计与开发全链路。 非侵入式：默认不修改现有项目代码，所有输出隔离在 .extract-design-system/ 与 design-system/ 目录，风险可控。 版本明确：v1 定位清晰，聚焦原语提取而非完整组件库，避免过度承诺。 潜在缺点与局限性 动态内容限制：SPA、懒加载或权限墙后的页面可能提取不完整，工具明确声明不保证动态站点的完整性。 语义推断边界：仅提取可观测的 CSS 值，无法自动推断组件级语义 Token（如 button-primary 与 button-danger 的映射关系）。 单页视角：基于单一 URL 的提取无法代表整个产品的设计系统全貌，可能存在品牌不一致的子域或页面未覆盖。 质量依赖源站：若目标网站内联样式混乱或使用 CSS-in-JS 运行时生成，提取的 Token 可能缺乏系统性。 适合人群 需要快速搭建设计系统原型的前端开发者或设计师。 进行竞品视觉分析、品牌一致性审查的团队。 已有设计系统但希望参考外部站点进行 Token 校准的维护者。 常规风险 数据隐私：虽仅提取公开页面的样式，仍需确保目标 URL 符合组织的数据使用政策。 误用风险：归一化数据可能包含主观推断，直接作为权威设计系统使用可能导致与源站实际规范偏差。 覆盖风险：尽管工具默认隔离输出，若用户手动复制 Token 到现有系统，需确认不覆盖关键业务样式。 依赖安全：依赖 Playwright 与 Chromium，需确保 npx 执行环境的包来源可信。 原始说明 Extract design primitives from a public website and generate starter token files for your project.