frontend-design 是一项面向前端界面设计与实现的技能，来源于 danielsogl/copilot-workflow-demo。其目标是帮助创建具有辨识度、达到生产级质量的前端界面，并刻意避开常见的模板化 AI 审美。
用途 该技能在用户要求构建 Web 组件、页面、应用产物或交互界面时使用。它关注的不是单纯把功能跑通，而是在功能可用的基础上落实明确的设计主张与细致的视觉打磨。
主要能力
- 设计思考：编码前先梳理界面要解决的问题与使用者，确定一个鲜明的美学方向（如极简、极繁、复古未来、自然有机、奢华精致、玩具感、杂志编辑风、粗野主义、装饰几何、柔和粉彩、工业实用等），并考虑框架、性能、可访问性等技术约束，同时思考如何让作品令人难忘。
- 代码实现：输出可运行的生产级代码，支持 HTML/CSS/JS、React、Vue 等技术栈，要求视觉醒目、风格统一、细节精炼。
- 美学规范：字体上强调独特且有表现力的字体搭配，避免 Arial、Inter、Roboto、系统字体等通用选择；配色上主张统一的美学基调，用 CSS 变量保证一致性，以主色加锐利点缀替代平均分布的怯懦配色；动效上优先 CSS 方案，React 场景可用 Motion 库，重视有编排感的页面加载、错峰显现（animation-delay）、滚动触发与悬停状态；空间构图鼓励非对称、重叠、对角线流动、破格元素，以及大留白或受控密度；背景与视觉细节鼓励渐变网格、噪点纹理、几何图案、层叠透明、戏剧性阴影、装饰边框、自定义光标与颗粒叠加等手法营造氛围与纵深。
- 复杂度匹配：极繁设计需要更繁复的动画与效果代码，极简或精致设计则需要克制、精确以及对间距、字体和细节的专注。
使用方式 用户提供前端需求（组件、页面、应用或界面），可附带用途、受众或技术约束等背景。技能先进行设计思考并确定美学方向，再实现满足需求的可运行代码。资料未提供具体安装命令、调用参数或配置文件说明。
适用场景 需要打造有独特视觉语言、避免千篇一律风格的网站组件、落地页、应用界面或交互原型；也适用于需要在多个方案间变化字体、明暗主题与美学风格的创作任务。
限制 资料未提供收费、价格、平台支持范围、性能指标或效果保证等信息。该技能强调设计判断与实现质量，实际产出取决于用户提供的需求与约束；对具体框架版本、浏览器兼容性等细节暂未提供说明。