用途：该技能为智能体提供构建高端前端体验的蓝图，目标是生成有意图、达到获奖水准的 Web 应用，兼顾美学质量、深度交互与流畅性能。适用于用户要求高端落地页、交互式作品集或需要顶级视觉打磨的组件时。
主要能力：确立强烈视觉识别（编辑式粗野主义、有机流动、赛博技术、电影化节奏）；搭建沉浸式结构，包括入场预加载序列、全屏 Hero 架构、随滚动方向响应的粘性导航；建立动效系统，涵盖滚动驱动叙事（固定容器、横向旅程、视差）、高保真微交互（磁吸按钮、自定义光标、维度悬停）；排版与视觉质感（极端字号对比、可变字体、噪点叠加、玻璃拟态）；性能护栏（仅动画 transform 与 opacity、合理使用 will-change、响应式降级、无障碍适配）。
使用方式：在 React/Next.js 中可结合 Framer Motion、Lenis（@studio-freight/lenis）、React Three Fiber（@react-three/fiber）；在原生/HTML/Astro 中可依赖 GSAP、CDN 版 Lenis、SplitType。跨客户端：GitHub Copilot 放入可见技能路径；Claude Code 放入本地技能目录或兼容插件源；Codex 同步到 $CODEX_HOME/skills/<skill-name> 并重启；Gemini CLI 用 python scripts/export-gemini-skill.py premium-frontend-ui 重建命令后执行 /commands reload。无需 MCP 服务器，可回退到本地 SKILL.md 与手动验证。
限制：需在批准前通过共享组件评审标准，覆盖加载、空、错误、成功与响应式断点，并在窄屏移动端、纯键盘路径与慢加载状态下压力测试。避免从通用模板直接套用、忽略最终渲染审查、一次性同时修改内容与呈现。具体收费、价格与平台支持范围资料未提供。