build-frontend
build-frontend 是一个用于构建或修改前端界面的技能，强调复用仓库原生组件，并保持无障碍、响应式行为、状态处理与视觉一致性。
Skill 广场
找到适合任务的 Agent Skill，阅读介绍并复制安装命令。
更新于 10-29 00:09
前端与建站
11,266 个结果
visual-qa
visual-qa 是一个基于浏览器的前端视觉 QA 技能：打开运行中的应用、截图受影响页面与视口，识别布局、样式与 UX 问题，并可自动修复琐碎问题。
vue-pinia
面向 Vue 应用的 Pinia 状态管理技能，覆盖 store 设计、actions、getters、插件与持久化，按主题与难度分级教学，含练习、检查点与排错指南。
vue-typescript
Vue TypeScript 是一个面向 Vue 3 与 TypeScript 集成开发的生产级技能，专注于类型安全组件、泛型、类型推断与高级类型模式。该技能通过五个学习模块帮助开发者掌握在 Vue 项目中使用 TypeScript 的核心能力：TypeScript 环境配置（tsconfig、Volar、env.d.ts、vue-tsc）、带类型的组件编写（defineProps、defineEmits、withDefaults、defineExpose、defineSlots）、泛型组件、带类型的组合式函数与状态管理（Composable 返回值、Pinia store、getters、actions），以及高级类型模式（工具类型、模块扩展、条件类型、模板引用）。技能支持按主题（config、components、generics、stores、inference、all）和难度等级（beginner、intermediate、advanced）参数化调用。资料提供了完整的示例代码、校验检查点、排错指南与基于 vitest 和 @vue/test-utils 的单元测试模板，适合希望提升 Vue 项目类型安全性的前端开发者。
next-cache-components
Next.js 16 的 Cache Components 技能说明：通过 PPR 在单个路由中混合静态、缓存与动态内容，含 use cache 指令、cacheLife、cacheTag、updateTag 及迁移与限制说明。
next-upgrade
依据官方迁移指南与 codemod 把 Next.js 项目升级到最新版本的技能，可检测当前版本、确定升级路径、运行 codemod 转换、更新依赖并验证构建。
apple-build-native-uis
基于 Apple 官方 Develop in Swift 教程与 SwiftUI Concepts 整理的 SwiftUI 界面开发指南，包含 10 大类 49 条规则，按影响优先级排序，覆盖视图组合、布局、样式、状态管理、导航、列表、输入、无障碍、测试与打磨，用于构建、审查或重构 SwiftUI 视图。
nextjs-16-app-router
面向 AI 智能体的可安装技能，提供 Next.js 16 App Router 性能优化最佳实践，由 Next.js 社区维护，含 8 大类共 40 条按影响优先级排序的规则，用于指导自动重构与代码生成。
cinematic-ui
cinematic-ui 是一个面向 Claude Code 与 OpenAI Codex 的电影化网页设计技能，用导演与具体影片确定网站情感语言，再转化为页面叙事、分镜、动效与可实现的网页规格。
human-view
human-view 是面向信息设计的一个技能，为所提供内容给出清晰、有用的默认视觉呈现，适用于尚未确定形式的 HTML 报告、解说、计划或界面，帮助读者理解、检查并采取行动。
i18n-translate
i18n-translate 是一套用于维护项目前端国际化多语言翻译的流程与脚本集合，覆盖查找缺失翻译键、检测未翻译条目以及为各语言补全翻译等步骤，涉及 en、zh、fr、ja、ru、vi 六种语言区域文件。
journal-creator
Journal Creator 是一个技能，用于读取已确认的软件规格（SRS）、架构文档和前端设计规格，生成按依赖排序的用户故事与技术故事日志 docs/planning/journal.md，帮助把需求与架构决策转化为可执行的开发待办。
react-refactor-tournament
一个面向 React/Next.js 的性能重构技能：调用 vercel-react-best-practices 规则审查代码，按真实 rule id 与影响层级建立重构待办清单，排序后自动修复最严重的 N 项，每项在独立 git worktree 中完成并提交（不推送、不合并）。
frontend-starter-kit
一套前端项目启动工具包，通过一条命令集中安装 14 个环境配置技能、14 个自有工作流技能与若干可选社区技能，面向新建前端项目的初始化与规范搭建。
revyl-cli-auth-bypass-react-native
面向 bare React Native 应用的测试专用鉴权绕过深链配方：通过 Revyl launch variables 门控，用 myapp://revyl-auth 深链在测试构建中创建受限测试会话，仅供测试环境使用。
css-modern
css-modern 是一个面向现代 CSS 编写方式的技能规范，出自 robert-hoffmann/parallax-designer。它主张以符合 DTCG 格式的设计令牌作为样式数据的唯一来源，将令牌映射为 CSS 自定义属性与语义别名，并通过 @layer 明确声明级联层顺序、把第三方 CSS 隔离到独立的 vendor 层。组件样式使用原生嵌套、现代选择器（:has、:is、:where、:focus-visible）和容器查询实现组件级响应式，配合 clamp()/min()/max() 实现流式尺寸、逻辑属性和 oklch、color-mix()、light-dark() 等现代颜色能力。对支持度有限的新特性，要求用 @supports 加显式回退做分层渐进增强，并兼顾减少动效偏好、无障碍焦点状态与渲染性能。适用于需要统一设计令牌、控制样式级联和推进现代 CSS 落地的前端项目。
tailwind-modern
tailwind-modern 是一个面向 Tailwind CSS v4 的配置与写作规范技能，用于在独立 HTML/CDN、Vue + Vite 和 Nuxt 环境中强制采用现代 Tailwind 写法，并完成迁移与调试。它要求先识别目标环境，再按对应框架配方选择配置路径；核心是 CSS-first 设置，例如使用 @import "tailwindcss" 而非 @tailwind base 等旧指令，并优先使用 @theme、@utility、@variant、@custom-variant、@source、@reference 等 CSS 指令。技能还提供按需参考文档：tailwind-v4-guardrails.md 给出严格规则与废弃语法陷阱，framework-recipes.md 说明各环境配置路径，tailwind-v3-to-v4-deltas.md 提供迁移矩阵与升级替换。适用于需要保持 Tailwind v4 一致性、避免过时模式、进行版本升级或排查配置问题的前端项目。
dynamic-forms
dynamic-forms 是 RoleModel 的技能，用于构建随填随变的表单，如级联或依赖下拉、条件字段与分区、依赖其他字段的选项列表。它规定动态表单统一用 turbo_form gem 驱动，不应手写 turbo_fetch 路由、动作、视图或 Stimulus 控制器。
layout
这是一个面向 SwiftUI 的布局技能，聚焦 Layout 协议、Grid 与 lazy grid、自定义容器（含 sections 与 container values）以及 lazy stack 与滚动性能规则，用于解决等宽控件、自适应容器、懒加载卡顿与滚动定位等问题。
video2html
video2html 是将已批准的 UI 图像与参考视频（由图像转视频生成）转换为可交互的活 HTML 的技能。它从视频中提取运动信息（通过像素运动图和 Gemini 分析），将参考视频作为运动灵感而非严格规范，内容（文本、布局、颜色）来自图像。输出为包含 CSS/SVG、Canvas 2D 或 WebGL/Three.js 动画的 HTML，实现空闲动画与交互触发，而非使用视频作为资源。适用于网页界面原型、交互动效演示等场景，提供完整的分析、构建、验证流程和辅助脚本。
react-best-practices
来自 Vercel Engineering（vercel-labs/agent-skills）的 React 性能优化指南，含 8 大类共 70 条规则，按影响优先级排序，用于编写、审查或重构 React 组件时参考。
caching-strategy
Saleor Storefront 的缓存策略技能，讲解 Next.js Cache Components（PPR）、use cache、cacheLife、cacheTag 与 revalidation 机制，用于排查内容陈旧、修改缓存行为或配置 Saleor webhook 失效。
react-patterns
一份面向 React 开发的编码规范技能，强调遵循组件生命周期、保持渲染纯净并正确使用 hooks。适用于编写或审查组件、修复 hooks 与纯净性相关的 lint 错误，以及判断逻辑应放在渲染、副作用还是事件处理中。
ui-components
用于在 Saleor storefront 项目中创建与样式化 UI 组件的技能，基于 shadcn/ui 组件模式与设计令牌，指导组件放置、Tailwind 样式、Server/Client 组件选择及基础组件复用。