用途：在用户请求构建 Web 组件、页面、应用或界面时，指导生成具有鲜明美学方向、可直接运行的前端代码，避免过度常见的 AI 生成审美。
主要能力：支持从零原创设计，也支持根据用户提供的截图、图像或设计参考进行复刻。提供设计思考流程，包括明确用途、受众、技术约束、选定极端化美学方向并保持差异化；覆盖排版、配色与主题、动效、空间构图、背景与视觉细节、视觉资产等前端审美准则，可结合 ai-multimodal 生成与设计一致的视觉资产，并用媒体处理技能去除生成资产背景。
使用方式：用户提供组件、页面、应用或界面需求，可附带截图、图像、设计参考及用途、受众、技术约束。若输入为截图/图像/设计参考，必须先用 ./references/design-extraction-overview.md 提取设计规范（颜色十六进制、字体、字号、字重、间距、布局、视觉层级），记录到 docs/design-guidelines/extracted-design.md，再进行实现，最后按 ./references/visual-analysis-overview.md 校验质量。从零构建则按设计思考流程执行。实现可使用 HTML/CSS/JS、React、Vue 等。动效优先 CSS，React 可用 Motion，动画可参考 ./references/animejs.md。资产生成参考 ./references/asset-generation.md，技术优化参考 ./references/technical-overview.md。
适用场景：需要高设计质量、有明确审美观点、区别于模板化产出的前端界面开发。
限制：资料未提供具体收费、价格、平台支持范围与效果保证；使用截图复刻时须先提取设计规范，不可跳过直接实现。