SuperAPI AI 工具集

frontend-aesthetics

前端与建站

查看项目

更新于 10-16 06:51

技能介绍

用途:该技能用于把前端界面从“一致且正确”提升到“有辨识度”,避免所谓 AI slop 的通用风格。默认风格偏扁平、干净、可访问、仅用一个克制的强调色,不使用霓虹、发光、渐变网和闪光效果。若宿主项目的设计系统或品牌明确要求此类风格,应以宿主项目为准,核心约束是反通用而非反品牌。

主要能力:采用两遍流程。第一遍写简洁设计计划:4–6 个带角色名的十六进制颜色值(由单一色相派生)、至少两种字体角色(展示/正文/等宽)及明确的字号跳跃、布局意图与关键界面草图、一个具辨识度的标志性元素。第二遍在建代码前自我批判该计划,若某部分像是任意类似页面都会产出的通用默认,就修改并说明改动原因。同时在 .claude/design/design-system.md 中沉淀 Signature 与 Do/Dont。

字体与色彩:避开 Inter、Roboto、Open Sans、Arial、原始 system-ui 等默认迹象,改用如 IBM Plex、Newsreader、Space Grotesk、Bricolage Grotesque、Playfair Display、JetBrains Mono 等组合,并制造明显的字重与字号跳跃。色彩上采用“主色占约七成表面 + 少量强调色”的层级,且需先满足 WCAG AA 对比度。

限制:需要自行在可渲染环境中截图并按需自检,完整循环可交给 design-vision-loop 技能。承诺的打磨程度必须与实际实现匹配,只交付完整可行的小版本,不要给出无法兑现的精美规格。