该技能是一个面向智能体的前端设计指导技能，目标是帮助创建独特、具备生产级质量的前端界面，避免常见的通用“AI 生成”审美。
用途
当用户要求构建 Web 组件、页面、应用或界面时使用该技能。用户会提供前端需求，包括要构建的组件、页面、应用或界面，也可能包含关于用途、受众或技术约束的背景信息。技能会引导实现真实可运行的代码，并在审美细节和创意选择上给予高度重视。
主要能力
技能包含设计思考与前端美学准则两大部分。
设计思考要求在写代码前理解上下文，并确定一个大胆的审美方向，包括：目的（这个界面解决什么问题、谁使用它）、基调（选择一个极端方向，如极简、极繁混乱、复古未来、有机自然、奢华精致、俏皮玩具感、杂志编辑风、粗野原始、装饰几何、柔和粉彩、工业实用等）、约束（框架、性能、无障碍等技术要求）、差异化（什么让界面令人难忘、最让人记住的一点是什么）。技能强调选择一个明确的概念方向并以精确方式执行，极繁主义和精致极简都可行，关键在于有意为之而非强度大小。随后实现可运行代码（HTML/CSS/JS、React、Vue 等），要求生产级且可运行、视觉上引人注目且难忘、风格统一且审美观点清晰、每个细节都经过细致打磨。
使用方式
技能本身并未在资料中提供安装命令或具体调用步骤，暂未提供。资料说明的使用方式是在用户请求构建前端界面时启用该技能，按其指导进行设计思考并编写代码。
适用的前端美学准则
排版：选择美丽、独特、有趣的字体，避免 Arial、Inter 等通用字体，改用有辨识度、有性格的字体，将独特的展示字体与精致的正文字体搭配。
色彩与主题：坚持统一的审美，使用 CSS 变量保证一致性；主色搭配锐利点缀色比平均分布的保守配色更出色。
动效：用动画实现效果与微交互。HTML 优先使用纯 CSS 方案，React 可用时使用 Motion 库。聚焦高影响力时刻，例如一次编排良好的页面载入配合交错揭示（animation-delay）比零散的微交互更令人愉悦，并使用带惊喜感的滚动触发与悬停状态。
空间构图：使用出乎意料的布局、不对称、重叠、对角流动、打破网格的元素，以及大片留白或有控制的密集。
背景与视觉细节：营造氛围与深度而不是默认使用纯色，加入与整体审美相符的上下文效果与纹理，如渐变网格、噪点纹理、几何图案、分层透明、戏剧化阴影、装饰边框、自定义光标、颗粒叠加等。
适用场景
适用于需要构建具有鲜明设计个性、非模板化外观的 Web 组件、页面与应用界面，尤其是希望避免陈词滥调配色、通用字体和可预测布局的场合。
限制与注意事项
技能明确禁止使用过度使用的通用 AI 审美，如 Inter、Roboto、Arial、系统字体等常见字体家族，白底紫色渐变等陈词滥调配色，可预测的布局与组件模式，以及缺乏语境特征的千篇一律设计。设计应富有创意并做出出乎意料的选择，不同设计之间应有所变化，在浅色与深色主题、字体与审美之间轮换，不应在不同生成结果中反复收敛到相同选择（例如 Space Grotesk）。实现复杂度需匹配审美愿景：极繁设计需要大量动画与效果的复杂代码，极简或精致设计则需要克制、精确，并仔细处理间距、排版和微妙细节。资料未提供具体收费、价格、平台支持范围等信息，暂未提供。