Agent Skills
› vercel-labs/open-agents
vercel-labs/open-agents
GitHub用于自动化浏览器交互的工具，支持网页导航、元素快照分析、点击填充等交互操作及数据提取。适用于Web应用测试、表单填写和页面信息抓取场景。
Install All Skills
npx skills add vercel-labs/open-agents --all -g -y
Skills in Collection (13)
用于自动化浏览器交互的工具，支持网页导航、元素快照分析、点击填充等交互操作及数据提取。适用于Web应用测试、表单填写和页面信息抓取场景。
需要自动化浏览网页或执行Web测试
需要从网页中提取数据或截图
需要自动填写表单或与页面元素交互
npx skills add vercel-labs/open-agents --skill agent-browser -g -y
为Tailwind CSS项目提供UI开发规范，涵盖动画、排版、组件可访问性及布局约束，防止AI生成劣质界面。支持自动应用或文件审查，输出违规项及修复建议。
构建UI组件
审查CSS工具类样式
检查React视图样式一致性
npx skills add vercel-labs/open-agents --skill baseline-ui -g -y
代码审查技能，用于分析PR、Diff或提交记录，提供关于Bug、安全、结构和性能的 actionable 反馈。支持无参审查未提交更改、指定Commit、分支对比及PR查看，强调结合上下文与安全边界评估。
/review
review this PR
review my changes
code review
npx skills add vercel-labs/open-agents --skill code-review -g -y
指导用户部署 Open Harness 应用，包括收集凭证、在 Vercel 上部署及完成首次运行设置。适用于部署、自托管或配置相关请求。
部署 Open Harness
自托管应用
Vercel 部署配置
获取环境变量凭证
npx skills add vercel-labs/open-agents --skill deploy-open-harness -g -y
基于Emil Kowalski理念的前端UI设计工程技能，涵盖UI打磨、组件设计、动画决策及细节优化。通过训练直觉与关注隐形细节提升产品体验，提供具体的代码审查格式规范。
需要提升UI/UX设计质量时
审查前端界面代码细节时
讨论动画或交互体验优化时
npx skills add vercel-labs/open-agents --skill emil-design-eng -g -y
指导创建具有独特设计感的高质量前端界面，避免通用AI美学。适用于构建网页、组件、仪表盘等，强调大胆的美学方向、精细的排版与动效，生成生产级代码。
用户要求构建网页或UI组件
需要美化或重新设计现有Web界面
请求生成具有特定艺术风格的HTML/CSS/React代码
npx skills add vercel-labs/open-agents --skill frontend-design -g -y
用于非平凡任务实施前的系统级规划，通过探索代码库、澄清需求并生成 PLAN.md，确保方案与架构一致且最小化复杂度。
/plan
plan this
design an approach
let's plan first
npx skills add vercel-labs/open-agents --skill plan-mode -g -y
移除托管演示的限制，使分叉仓库像正常自托管部署一样运行。包括取消会话和消息的试用限制、删除托管专属错误提示及无效代码，并更新相关测试用例。
remove demo limits
remove trial limits
remove hosted restrictions
open this up for my fork
remove managed template restrictions
npx skills add vercel-labs/open-agents --skill remove-demo-limits -g -y
基于Vercel工程的React和Next.js性能优化指南，涵盖消除数据瀑布、包体积优化、服务端及客户端性能等58条规则，用于指导代码编写、审查与重构以提升应用性能。
编写或重构React组件/Next.js页面
进行代码审查以发现性能问题
优化数据获取策略
减小包体积或提升加载速度
npx skills add vercel-labs/open-agents --skill vercel-react-best-practices -g -y
基于Vercel Workflow DevKit构建持久化、可恢复的工作流，支持断点续传、外部事件暂停及多步协调。
需要构建持久化工作流
提及 durable functions
提及 resumable workflows
涉及多步骤编排
npx skills add vercel-labs/open-agents --skill workflow -g -y
协助开发者使用Vercel AI SDK构建AI功能，解答API疑问并生成代码。强调查阅最新文档而非依赖记忆，支持Agent、聊天机器人及RAG系统开发。
询问AI SDK函数用法
构建AI代理或聊天机器人
集成AI提供商服务
实现流式输出或结构化输出
npx skills add vercel-labs/open-agents --skill ai-sdk -g -y
提供统一 TypeScript SDK，支持构建跨平台聊天机器人（如 Slack、Teams、Discord 等）。涵盖事件处理、消息发送、卡片交互及 AI 流式响应，适用于多平台适配与状态管理。
Build a Slack, Teams, Google Chat, Discord, Telegram, GitHub, Linear, or WhatsApp bot
Use Chat SDK to handle mentions, direct messages, subscribed threads, reactions, slash commands, cards, modals, files, or AI streaming
Set up webhook routes or multi-adapter bots
Send rich cards or streamed AI responses to chat platforms
Build or maintain a custom adapter or state adapter
npx skills add vercel-labs/open-agents --skill chat-sdk -g -y
专注于Web动画设计与实现，涵盖缓动、时序及性能优化。提供基于Emil Kowalski课程的规范，指导UI元素入场/出场动画、微交互及无障碍适配，确保动画自然流畅。
用户询问动画缓动曲线（如ease-in-out, cubic-bezier）
需要设计或审查UI过渡、微交互及页面转场动画
咨询动画性能优化或无障碍运动偏好设置
npx skills add vercel-labs/open-agents --skill web-animation-design -g -y
