用途：为前端界面提供视觉设计与美学方向，适用于构建组件、页面、应用或界面时确定视觉识别。
主要能力：先读取前端需求并检测现有设计环境，统计设计令牌/CSS 变量、组件库（shadcn、MUI、Ant）、CSS 框架配置（Tailwind、styled-components）、字体导入、色彩系统、动画模式、间距尺度等信号。4 个以上信号视为已有系统，应匹配并扩展；1-3 个为部分系统，应融合；0 个为全新项目，应用完整设计哲学。
使用方式：对完整页面、应用或多组件界面，先写三句设计哲学——意图（引发何种情绪）、标志（哪个视觉选择使其独特）、约束（刻意不做什么），再实现代码。小型组件可跳过哲学，直接匹配周边设计系统。导入第三方库前先检查 package.json，缺失时先输出安装命令。
设计要点：字体避免 Inter、Roboto、Arial、系统字体，标题从 text-4xl md:text-6xl tracking-tighter leading-none 起步；最多一个强调色，饱和度低于 80%；动画优先 CSS，React 可用 Motion，仅用 transform 和 opacity；布局可用不对称、重叠、破格；避免紫色渐变、三列圆形图标网格、居中过多、统一大圆角、通用英雄文案等 AI 常见模式。
限制：资料未提供具体收费、平台支持范围或效果保证；部分引用文件（如 motion-patterns.md、banned-ai-patterns.md）内容未在资料中展开。