用途：为 Web 与 React Native 组件的视觉设计与品牌识别提供指导与审查，目标是让组件不仅“正确”，而且好看、符合品牌。它负责生成式、品牌感知的视觉工作，包括配色系统、字体搭配、视觉层级、标志性细节与命名风格方向。
主要能力：提供三种模式——guide（默认，产出构建清单）、review（审查与改进视觉，判断是否像通用 AI 应用）、direction（提出风格方向与品牌识别简报）。核心产出包括设计令牌（颜色、字体、间距、圆角/阴影）、层级结构、标志性细节以及可直接粘贴的代码实现。审查沿用 Critical/High/Medium/Low 严重度阶梯，问题需标注 file:line、命名原则与具体修复代码。
使用方式：解析 $ARGUMENTS，首个位置参数若匹配模式名则选择该模式，否则默认 guide；在继续前先声明检测到的模式与目标。第一阶段做上下文发现：识别目标（显式路径、近期改动或当前编辑文件）、判断平台（Web 或 React Native/Expo，模糊时询问）、读取主题令牌与设计系统入口及至少两个同级组件、读取代码，未读代码不审查不生成。第二阶段按模式加载规则，按需加载而非全部预载。第三阶段与其他技能组合：图表调用 charting，动效调用 animations，新故事调用 storybook，对比度、尺寸最小值、暗色模式、图标一致性、ARIA 交给 /ux 规则；缺失技能记一行跳过并继续。
适用场景：新组件的视觉设计与构建清单；视觉审查与改进；确定风格方向与品牌视觉翻译；判断组件是否显得通用。限制：不重新推导 WCAG 对比度、触控目标最小值、暗色模式色彩计算，这些交由 /ux 规则；动效机制归 animations，图表类型与库选择归 charting；不编造项目未声明的品牌声音，用户未命名前需先询问；具体模式、规则文件与模板的完整细节需查阅该技能仓库。