用途:frontend-design 用于在用户要求构建 Web 组件、页面或制品时,指导生成独特、生产级、高设计质量的前端界面,避免通用化的“AI slop”审美,并实现真正可运行的代码。
主要能力:提供一套前端美学准则,覆盖设计方向、排版、颜色与主题、布局与空间、视觉细节、动效、交互、响应式与 UX 文案。要求先确定明确的概念方向(目的、语气、约束、差异化),再以精确方式执行,兼顾大胆极繁与精致极简。
使用方式:作为技能在构建前端界面时调用。排版上建议使用模块化字阶与 clamp 流体字号,搭配独特展示字体与精致正文字体;颜色上建议使用 oklch、color-mix、light-dark 等现代 CSS 颜色函数,中性色向品牌色偏移;布局上强调节奏、非对称与有意破格;动效聚焦高冲击时刻,使用指数缓动,仅动画 transform 与 opacity;交互上采用渐进披露与乐观 UI;响应式建议使用容器查询。
适用场景:需要打造有辨识度、可记忆、细节精致的网页界面、组件或制品时。
限制:资料未提供具体安装命令、收费、价格、平台支持或效果保证;文中提到的排版、颜色、空间、动效、交互、响应式、UX 文案等参考文档未在资料中给出具体内容。