用途：designlang 通过 Playwright 无头浏览器抓取网站，从实时 DOM 提取计算样式，生成完整设计系统，用于复用参考站设计、对比品牌、监控设计变更或为 AI 提供设计上下文。
主要能力：输出 8 类文件，包括 AI 优化 markdown、可视化 HTML 预览、Tailwind 配置、React 主题、shadcn/ui 主题、Figma 变量、W3C 设计令牌和 CSS 自定义属性。markdown 覆盖 19 个部分，如色板、排版、间距、圆角、阴影、断点、动效、组件模式、布局、无障碍对比度、渐变、z-index、SVG 图标、字体文件等。还提供 score 评分、diff 对比、brands 多品牌矩阵、apply 应用到项目、clone 生成 Next.js 起步项目、watch 监控、sync 同步、history 历史等命令。
使用方式：可直接运行 npx designlang https://stripe.com，或全局安装 npm install -g designlang，也可作为智能体技能安装 npx skills add Manavarya09/design-extract。常用选项包括 --out、--name、--wait、--dark、--depth、--screenshots、--responsive、--interactions、--full、--cookie、--header、--framework 等。受保护页面可通过 --cookie 和 --header 传入认证信息。
适用场景：从参考站提取设计令牌并合并到 Tailwind 项目；将 markdown 提供给 Claude、GPT-4 或 Cursor 生成一致组件；对比竞品设计；为 shadcn/ui 项目应用主题；生成 W3C 令牌供设计工具使用；监控线上设计变化。
限制：需要安装 Playwright 浏览器（npx playwright install chromium）；JavaScript 重的 SPA 需加 --wait；工具类 CSS 站点可能提取过多颜色，可用 --depth 0 等限制；apply 命令依赖项目中的 tailwind.config.js 或 components.json 来识别框架。具体收费、平台支持范围等资料暂未提供。