用途：当用户要求构建或改进前端界面时使用，包括网站、落地页、仪表盘、应用界面、HTML/CSS 产物、React/Vue/Svelte 组件，或对现有 UI 做视觉重设计。目标不是简单美化，而是交付可运行的前端代码，并带有清晰的设计观点与足够的产品细节。
主要能力与工作流：先理解需求，识别受众、核心任务、领域与情绪基调，记录框架、现有样式、无障碍、性能、导出目标、响应式等技术约束；若仓库已有设计令牌、组件、截图或 DESIGN.md，以其为准。随后确定一个具体美学方向（如极简、编辑风、奢华、工业、复古未来、密集运营、沉稳企业等），通过字体、间距、色彩、层级、动效与组件形态落实，避免紫蓝渐变、模糊玻璃卡片、可互换的 SaaS 布局等通用 AI 默认风格。设计真实界面而非占位海报，包含控件、空/加载/错误状态、表格、筛选、导航与响应式行为，内容诚实，未知数据标注为示例或待定。
构建要求：优先沿用仓库现有框架、组件约定、图标、令牌与样式方案；独立产物默认自包含 HTML/CSS/JS，除非用户指定框架。使用语义化标记、键盘可访问控件、可见焦点状态、合理对比度与响应式约束，重复颜色、间距、阴影与字号用 CSS 变量。视觉打磨涵盖字体搭配、角色清晰的配色、对齐与节奏、有目的的动效（优先 transform 与 opacity）及必要的纹理、边框、阴影、分隔与图标。交付前自检移动与桌面宽度、文本不溢出、交互状态齐全、避免明显 AI 视觉套路，并保留一个令人印象深刻的记忆点。
OpenDesign 集成：当 OpenDesign 提供活动设计系统时，将其视为品牌契约，优先使用注入的颜色、字体、布局与组件指引，设计系统未覆盖处再应用本技能的工艺规则；若品牌指引与通用工艺规则冲突，以品牌指引为准。
限制：资料未提供具体收费、价格、平台支持范围或效果保证；上游为 Anthropic 官方技能仓库，采用 Apache-2.0 许可。