skill简介：用于用于从网站URL提取视觉设计系统并生成 DESIGN.md 文件的工具。它通过访问目标网站，解析其样式表、计算样式和组件模式，将设计元素（颜色、排版、间距、组件）转化为符合 google-labs-code/design.md 规范 的结构化文档。输出包含机器可读的YAML设计标记（颜色、字体、间距等）和人类可读的设计说明（品牌风格、使用指南等）。
使用场景介绍：
-
设计系统反向工程：当需要将现有网站的视觉设计规范（如品牌色、字体层级、组件样式）转化为标准化文档时使用，适用于重构、迁移或跨团队协作场景。
-
前端开发辅助：为开发人员提供明确的设计标记（如
{colors.primary}、{spacing.lg}），确保UI实现与设计意图一致。 -
处理复杂网站：支持需要JavaScript渲染的SPA（单页应用）或需登录认证的网站（需配合Playwright工具的
--headed --persistent模式）。 -
设计规范验证：生成的
DESIGN.md可通过npx @google/design.md lint命令校验，确保符合行业标准格式。
效果展示：
-
被提取样式的网站：
-
没有结合生成design样式的原网页效果：
-
用提示词“参考生成的design.md来刷新网站样式”，生成结果：
