@vercel-labs
Covers frontend, backend, devops — known for find-skills, vercel-react-best-practices, web-design-guidelines.
All Skills by @vercel-labs
find-skills
by @vercel-labs
Helps users discover and install agent skills, answering questions like "how to do X" or "find X skill," meeting user needs for new functionalities.
agent-browser
by @vercel-labs
Provides a browser automation command-line tool for AI agents, supporting web navigation, form filling, button clicks, and screenshots, enabling interaction with websites.
vercel-react-best-practices
by @vercel-labs
Vercel-maintained performance optimization guide for React and Next.js applications, containing 8 categories and 62 rules, helping developers build high-performance frontend applications.
web-design-guidelines
by @vercel-labs
Reviews UI code for compliance with web interface design guidelines, checking accessibility, design, and user experience to ensure interface quality and standards.
vercel-composition-patterns
by @vercel-labs
Provides React component composition patterns for building flexible, maintainable React components, avoiding prop drilling and boolean prop proliferation through techniques like compound components.
electron
by @vercel-labs
Automate Electron desktop applications like VS Code, Slack, etc., using a proxy browser via the Chrome DevTools Protocol.
vercel-sandbox
by @vercel-labs
Runs proxy browsers and Chrome in Vercel Sandbox micro-VMs, enabling browser automation for Vercel-deployed applications.
agentcore
by @vercel-labs
Run agent-browser in AWS Bedrock cloud browser sessions, with full compatibility for all standard commands and automatic credential parsing.
vercel-react-native-skills
by @vercel-labs
Official Vercel React Native intelligent agent skill set, designed to help mobile developers efficiently build and deploy cross-platform applications.
deploy-to-vercel
by @vercel-labs
Deploy applications and websites to Vercel, responding to user requests for deployment, link retrieval, or going live.
vercel-react-view-transitions
by @vercel-labs
This skill helps developers implement smooth, native-feeling view transition animations in React and Next.js applications. It leverages React's View Transition API to support page transitions, component entry/exit, shared element transitions, and directional navigation animations. Using the `<ViewTransition>` component and `next/link`'s `transitionTypes` prop, developers can easily create various complex animation effects, enhancing user experience, and provides ready-to-use CSS animation recipes.
vercel-cli-with-tokens
by @vercel-labs
Deploy and manage projects on Vercel using CLI with token authentication, supporting full project lifecycle management.
next-best-practices
by @vercel-labs
Provides Next.js best practices, covering file conventions, RSC boundaries, data patterns, asynchronous APIs, metadata, error handling, etc., to optimize Next.js application development.
vercel-optimize
by @vercel-labs
This skill optimizes Vercel projects for cost and performance, particularly for Next.js, SvelteKit, and Nuxt applications. It collects Vercel metrics, usage data, project configurations, and code scan results to provide data-backed, ranked recommendations. The goal is to reduce Vercel bills, improve Core Web Vitals, and optimize Function Invocations and Build Minutes, ensuring deployed applications run efficiently and cost-effectively.
writing-guidelines
by @vercel-labs
This skill automatically reviews documents and text content to ensure compliance with predefined writing guidelines and style guides. By automating checks, it significantly enhances document quality and consistency, reducing manual review time and error rates. Whether for technical documentation, API specifications, user manuals, blog posts, or marketing materials, this Skill helps teams maintain a professional brand image and clear communication standards, ensuring all published content meets high standards, thereby improving communication efficiency and user experience.
next-cache-components
by @vercel-labs
Introduces Next.js 16 caching components, including PPR, caching directives, cache lifecycle, cache tags, and revalidation tags.
next-upgrade
by @vercel-labs
Guides users on upgrading Next.js projects to the latest version, ensuring utilization of the newest features and performance optimizations, and improving development efficiency.
dogfood
by @vercel-labs
Possesses "dogfooding" capability, enabling AI agents to use their own developed products to discover and solve problems, improving product quality and user experience.
core
by @vercel-labs
Core package for defining frontend schemas, directories, and AI prompt generation, enhancing work efficiency and automation capabilities.
slack
by @vercel-labs
Interact with Slack workspaces via browser automation to check unread channels, send messages, extract data, etc.
codegen
by @vercel-labs
A set of utilities for generating code from UI specifications. It enables tree traversal, prop serialization, and custom code exporters, turning design specs into standardized component code quickly, reducing manual errors and boosting frontend development efficiency.
devtools
by @vercel-labs
This skill provides a drop-in inspector panel for debugging json-render applications. It allows developers to examine the UI element tree, runtime state, action logs, and stream patches, enabling quick identification of rendering issues, state edits, and spec exploration without building custom debugging tools. It boosts debugging productivity significantly.
portless
by @vercel-labs
Master Portless to set named URLs for local development servers, simplifying development environment configuration and improving convenience for parallel multi-project development.
mcp
by @vercel-labs
A toolkit to build MCP servers that render interactive UIs via JSON specs. It wraps json-render core and MCP protocol, enabling developers to quickly integrate dynamic UIs into Claude, ChatGPT, Cursor, and VS Code by simply defining UI structure and components, significantly reducing frontend development effort for MCP apps.
next-browser
by @vercel-labs
Automate installation and updates of the next-browser tool, integrating with Playwright to set up browser testing environments for Next.js applications.
react-native
by @vercel-labs
Convert JSON specifications into React Native component trees, supporting data binding, dynamic properties, visibility control, and interactive events.
oauth
by @vercel-labs
Configure OAuth providers (Google, Apple, Microsoft, etc.) to work with Portless local dev URLs. Fix "redirect_uri_mismatch" or "invalid redirect" errors caused by `.localhost` subdomains, ensuring smooth OAuth sign-in for local development.
before-and-after
by @vercel-labs
For processing before-and-after screenshots, providing specific guidance on package usage and proxy behavior. AI Agent Skill, enhancing work efficiency and automation capabilities.
konsistent-config
by @vercel-labs
This skill creates and maintains a konsistent.json that enforces filesystem structure and TypeScript import/export conventions for a project. It infers dominant patterns from the existing codebase and turns them into verifiable rules, reporting violations as audit output so teams keep folder layout and module boundaries intact as the codebase grows.
react-three-fiber
by @vercel-labs
React Three Fiber renderer, offering 19 built-in 3D components and supporting schema definitions for server-side rendering.
opensrc
by @vercel-labs
This skill lets AI agents fetch and cache source code for npm/PyPI/crates.io packages or GitHub repos with a single opensrc command, exposing real implementations beyond types and docs. It is ideal for debugging unexpected library behavior, validating edge cases, or learning proven design patterns from reputable projects, dramatically shortening investigation time.
vgpu
by @vercel-labs
This Skill routes documentation lookup through the project's locally installed vgpu CLI so agents read only the docs bundled with the exact selected package version, instead of guessing API shapes from memory, the default branch, or hosted sites. It is useful for dependency upgrades, migration-guide review, and any task where an outdated or generic API reference would cause rework, ensuring every code change is grounded in the correct version's guides and API pages.
native-sdk
by @vercel-labs
This skill provides complete guidance for building native desktop applications: apps are authored in TypeScript plus declarative Native markup and compiled to native binaries with no JS runtime; it supports Zig cores and WebView embedding, and includes an automation server for scaffolding, UI authoring, bridge commands, packaging, and automated testing, dramatically lowering the barrier for desktop development.
deployments-cicd
by @vercel-labs
This Skill provides expert guidance on Vercel deployment and CI/CD workflows, covering preview/production deployments, local builds, instant rollbacks, and integration with GitHub Actions, GitLab CI, and Bitbucket Pipelines. It enables teams to automate deployments and rollbacks with a single command, improving release velocity and reliability.
ink
by @vercel-labs
Renderer that converts JSON specifications into interactive terminal components for building command-line interfaces.
vercel-functions
by @vercel-labs
Provide expert guidance on Vercel Functions, including Serverless Functions, Edge Functions, Fluid Compute, streaming, Cron Jobs, and runtime configuration. Use when configuring, debugging, or optimizing server-side code running on Vercel, enabling developers to efficiently manage compute and improve performance.
ai-gateway
by @vercel-labs
This skill provides expert guidance for the Vercel AI Gateway, used to configure model routing, provider failover, cost tracking, and managing multiple AI providers through a unified API. It simplifies multi-model calls, ensures high availability and observability, while reducing development complexity.
vercel-agent
by @vercel-labs
Vercel Agent is an AI-powered code review and incident investigation tool that automatically analyzes PRs for security vulnerabilities and performance issues, provides root cause insights, and assists with SDK installation, boosting development efficiency and code quality.
env-vars
by @vercel-labs
This Skill provides expert guidance on managing environment variables in Vercel projects, covering .env file hierarchy, vercel env CLI commands, OIDC token lifecycle, and best practices. It helps developers initialize projects, set up local development, and maintain consistent environment configurations across deployments, preventing secret leaks and streamlining workflows.
turbopack
by @vercel-labs
This skill provides expert guidance on Turbopack, the Rust-powered JavaScript/TypeScript bundler by Vercel. It helps configure the Next.js 16 bundler, optimize Hot Module Replacement (HMR), debug build issues, and understand Turbopack vs Webpack differences. It covers CSS handling, CSS Modules, Sass, tree shaking, large bundle analysis, loader migration, and more. Ideal for developers optimizing build performance in large Next.js projects.
routing-middleware
by @vercel-labs
This skill intercepts requests at the Vercel platform level before cache, enabling rewrites, redirects, A/B testing, geolocation routing, and more. Developers write middleware.ts to implement custom request logic across any framework.
vercel-storage
by @vercel-labs
This skill provides expert guidance on Vercel storage options, including Vercel Blob, Edge Config, and Marketplace storage like Neon Postgres. It helps users choose, configure, and use the right storage for their applications, improving performance and developer productivity.
auth
by @vercel-labs
This skill provides authentication integration guidance for Vercel applications, covering Clerk, Descope, and Auth0 SDK installation, middleware configuration, route protection, and user data access, enabling developers to quickly implement user authentication flows and avoid manual documentation lookups and configuration errors.
verification
by @vercel-labs
This skill infers the full-stack feature being built and verifies each layer end-to-end: browser, API, data, and response. It triggers on dev server start or when users report issues, quickly identifying broken boundaries and reducing manual debugging time.
marketplace
by @vercel-labs
This skill helps developers quickly discover, install, and manage third-party integrations on the Vercel platform. By following a standardized categorize-discover-install workflow, developers can provision services like commerce, payments, and monitoring without manually searching docs or SDKs, significantly reducing discovery and setup time.
bootstrap
by @vercel-labs
This skill orchestrates the bootstrap process for Vercel-linked projects, handling linking, environment provisioning, database setup, and more in strict order. It prevents failures from incorrect task sequencing and streamlines project initialization or repair, making it ideal for teams working with Vercel-dependent repositories.
runtime-cache
by @vercel-labs
This skill provides guidance on using the Vercel Runtime Cache API, enabling ephemeral per-region key-value caching shared across Functions, Middleware, and Builds, with tag-based invalidation. It helps achieve lower latency and consistent data, suitable for caching strategies beyond framework-level.
create-remotion-geist
by @vercel-labs
Creates high-quality Remotion videos using the aesthetic principles of the Geist design system. This skill focuses on integrating design aesthetics into the video production process.
json-render-react
by @vercel-labs
A React renderer that converts JSON specification data into an interactive React component tree, enabling dynamic UI rendering.
json-render-core
by @vercel-labs
Provides core JSON rendering functionalities, including Schema definition, directory creation, and canonical stream processing, for building dynamic content and components.