Frontend Design

该技能强调设计意图先行，要求在编码前明确界面的目的、语气、约束和差异化。核心原则是：大胆而精确地选择一个美学方向（极致极简或繁复皆可，关键是意图明确），避免泛滥的 AI 模板风格（如 Space Grotesk 字体、紫白渐变背景、可预测布局）。

使用准则：

编码前先回答四个问题：Purpose（解决什么问题？谁使用？）、Tone（明确极端语气）、Constraints（技术要求/性能/可访问性）、Differentiation（什么让人难忘？） 字体选择：避免 Inter/Roboto/Arial/System 字体，推荐独特字体组合（标题用 Display 字体 + 正文用 Body 字体） 色彩方案：单一主色 + 尖锐点缀优于均匀分布的配色 布局：允许不对称、重叠、对角线、网格破坏、慷慨留白或受控密集 背景：避免纯色，采用渐变网、噪点纹理、几何图案、分层透明、戏剧阴影、装饰边框、自定义光标、颗粒覆盖 语言与框架：HTML/CSS/JS、React、Vue 等，根据设计复杂度匹配实现强度 拒绝收敛：不跟随通用 AI 选择（如统一用 Space Grotesk）

前置条件：

前端框架知识（HTML/CSS/JS、React、Vue） 无特殊依赖，输出代码需符合目标框架规范