Stitch 设计系统文档生成器
分析 Stitch 项目并生成可复用的 DESIGN.md 设计规范。
允许访问 Stitch MCP、读取文件、写入 DESIGN.md 和抓取网页；任务范围基本明确且未见恶意行为或凭据窃取，但没有用户确认、数据流披露、敏感数据处理、回滚或写入失败恢复机制，因此扣12分。
工作流步骤和输出结构较完整，但依赖 Stitch MCP、外部下载地址和提示指南，部分工具名称不一致（web_fetch 与 read_url_content），缺少针对异常输入、网络失败和空项目的诊断反馈；静态评估上限内给7分，扣13分。
目标用户、前置条件和主要场景清楚，且有示例提示；但未明确不适用范围、触发边界、中文输出支持或无 Stitch 项目时的替代路径，并依赖可能受中国大陆网络影响的海外 Stitch 服务，因此扣7分。
SKILL.md、README 和示例提供了较好的分层说明、安装方式、参数格式、输出模板和常见陷阱；但缺少明确版本号、变更日志、维护责任人、更新路径、FAQ 及依赖版本锁定，因此扣7分。Apache-2.0 许可证清晰；发布者未验证，但不作额外扣分。
技能明确生成可直接使用的 DESIGN.md，并规定颜色、组件、布局等输出内容，核心价值可信；但实际结果依赖可访问的 Stitch 项目和完整设计资产，且本次未执行或验证示例输出，因此按静态上限给6分，扣9分。
源文件、输出模板、示例和仓库 CI 提供了有限的可审计材料；但 CI 只验证其他 skill 的 TypeScript 示例，没有覆盖 design-md 的关键路径，也无第三方执行证据，因此给3分，扣7分。
- 核心功能依赖已配置且可访问的 Stitch MCP、项目资产下载地址和外部提示指南；在中国大陆网络环境中可能无法稳定使用。
- 执行前应明确确认目标项目、下载外部资源及写入 DESIGN.md 的范围，并补充失败处理和回滚方案。
- 示例和仓库 CI 未覆盖该 skill 的实际关键路径，生成内容仍需人工核对颜色、字体、尺寸和项目归属。
这个 Skill 能做什么，适合哪些场景？
这是 stitch-utilities 插件中的一个 Agent Skill，用于分析 Stitch 项目并生成 DESIGN.md。它读取项目、屏幕元数据以及 HTML/CSS 和可选截图，提取视觉主题、色彩、字体、组件样式和布局规律。生成的文档旨在成为提示 Stitch 创建新屏幕时的设计语言依据。它依赖已配置并运行的 Stitch MCP Server，适合需要保持现有界面风格一致的设计与前端团队。
通过 Stitch MCP Server 发现工具、查找项目和屏幕，并获取屏幕元数据、截图下载地址、HTML/CSS 下载地址、尺寸、设备类型及项目设计主题。随后使用 web_fetch 或 read_url_content 下载 HTML，解析 Tailwind 类、自定义 CSS 和组件模式，并将颜色、几何形状、阴影、字体、组件和布局原则综合写入项目目录中的 DESIGN.md。项目 ID 和标题也会被写入文档。
- 设计团队已有 Stitch 屏幕，希望提炼一份可供后续生成使用的统一设计规范。
- 前端团队需要让 Stitch 新生成的页面延续现有项目的颜色、字体、组件和布局语言。
- 项目负责人接手已有 Stitch 项目，需要将分散在屏幕和代码中的设计规律整理成单一文档。
- 使用 Stitch 生成多个新屏幕前，希望先建立包含精确颜色值和语义说明的设计系统依据。
这个 Skill 有哪些优点和局限？
- 输出结构覆盖视觉氛围、颜色角色、字体、组件样式和布局原则。
- 要求使用语义化设计语言，并保留精确的颜色十六进制值。
- 能结合屏幕截图、HTML/CSS 和项目级设计主题进行综合分析。
- 遵循 Agent Skills 开放标准，并面向包括 Codex、Claude Code、Gemini CLI、Cursor 在内的编码代理。
- 必须使用已配置并运行的 Stitch MCP Server，不能脱离 Stitch 项目独立工作。
- 源材料没有提供测试套件、版本兼容矩阵或明确的错误处理说明。
- 依赖网络获取屏幕 HTML/CSS，网络不可用时相关分析流程可能无法完成。
- 该技能只负责生成设计规范文档，不负责直接实现前端界面。
如何安装这个 Skill？
该技能位于仓库的 plugins/stitch-utilities/skills/design-md/。安装整个技能集合可运行：npx skills add google-labs-code/stitch-skills。也可按 README 将仓库注册为 Codex 插件市场，并安装 stitch-utilities 插件。源材料没有提供仅安装 design-md 子目录的专用命令。使用前还需配置并运行 Stitch MCP Server，并准备相应环境变量和凭据。
如何使用这个 Skill？
在已配置 Stitch MCP Server 的编码代理中输入类似："Analyze Stitch project projects/123 and generate a DESIGN.md." 如果未提供项目 ID，技能会先查找用户项目；如果未提供屏幕 ID，则会列出项目屏幕并根据标题识别目标屏幕。它随后获取屏幕代码和元数据，分析设计资产，并生成 DESIGN.md。具体的权限配置和失败重试流程未在源材料中说明。