frontend-design

用途：在新 UI 构建或既有界面重塑时，提供有意为之、具有辨识度的视觉设计指导，帮助确定美学方向、字体排印与版面选择。\n\n主要能力：以“小型设计工作室负责人”的视角，围绕克制的色彩（4–6 个具名十六进制值）、字体角色分工（个性展示字体、互补正文字体、必要时工具字体）、布局概念与“签名元素”产出设计计划；先做两轮：构思方案，再对照简报审查是否落入通用默认风格，修订后再写代码。还包含界面文案原则：用户视角命名、主动语态、错误与空状态给出明确指引、术语保持一致。\n\n使用方式：依据设计简报先自行确定具体主题、受众与页面单一目标；用一句话描述与 ASCII 线框图比较布局；确定唯一可记忆的签名元素；注意 CSS 选择器优先级冲突；构建到质量底线：移动端响应式、可见键盘焦点、尊重减少动态效果。若项目已有设计系统，先读 references/product-ui.md，既有 token 与组件优先。\n\n适用场景：网页落地页、产品界面、品牌视觉方向探索，以及需要摆脱模板化观感的设计任务。\n\n限制：资料未提供具体安装命令、运行环境或收费信息；文中引用的其他技能（如 web-design-guidelines、composition-patterns、emilkowal-animations、motion-v13）仅作为交互引用，未给出细节。