Vercel Skills

Add a vendor-official or community adapter to the Chat SDK catalog and docs — adapters.json registry, chat/adapters catalog entry, the docs MDX page,…

Add a new diagnostic code following the defineDiagnostics() conventions from nostics

Guide for adding new AI function examples, for testing specific features against the actual provider APIs.

Guide for adding new AI SDK harness packages. Use when creating a new @ai-sdk/harness-<name> package that adapts a coding-agent runtime to HarnessV1.

Guide for adding new AI provider packages to the AI SDK. Use when creating a new @ai-sdk/<provider> package to integrate an AI service into the SDK.

Admin UI and operator surface debugging for vercel-openclaw: command shell design, admin actions, request core, status panels, launch verification UI, channel…

Create and maintain Architecture Decision Records (ADRs) optimized for agentic coding workflows. Use when you need to propose, write, update, accept/reject,…

Automates browser interactions for web testing, form filling, screenshots, and data extraction.

Automates browser interactions for web testing, form filling, screenshots, and data extraction. Use when the user needs to navigate websites, interact with web…

Browser automation CLI for AI agents. Use when the user needs to interact with websites, verify dev server output, test web apps, navigate pages, fill forms,…

Automated browser verification for dev servers. Triggers when a dev server starts to run a visual gut-check with agent-browser — verifies the page loads,…

Companion skill for the Agent-Friendly APIs course on Vercel Academy. Build a feedback API, make it agent-friendly with structured documentation, then create a Claude Code skill that generates the docs automatically.

Python `ai` SDK — models, providers, streams, events, tools, agents, hooks, MCP, AI SDK UI, structured output, and media generation

Generate text, images, and video from the terminal using AI models.

AI Elements component library guidance — pre-built React components for AI interfaces built on shadcn/ui. Use when building chat UIs, message displays, tool…

Pre-built React components for AI chat interfaces built on shadcn/ui and the AI SDK. Includes conversation, message, tool display, and prompt input components designed for AI-native applications Installs directly into your project codebase via CLI, making components fully customizable and extensible with standard React patterns Requires Next.js, AI SDK, shadcn/ui, and Node.js 18+; integrates seamlessly with Vercel's AI Gateway for model access All components support standard HTML attributes...

Vercel AI Gateway expert guidance. Use when configuring model routing, provider failover, cost tracking, or managing multiple AI providers through a unified…

AI generation persistence patterns — unique IDs, addressable URLs, database storage, and cost tracking for every LLM generation

Vercel AI SDK expert guidance. Use when building AI-powered features — chat interfaces, text generation, structured output, tool calling, agents, MCP…

Answer questions about the AI SDK and help build AI-powered features. Use when developers: (1) Ask about AI SDK functions like generateText, streamText,…

Answer questions about the AI SDK and help build AI-powered features. Use when developers: (1) Ask about AI SDK functions like generateText, streamText,…

Convert Next.js bundle analyzer data to NDJSON and explore it

Generates agent-friendly markdown documentation for API routes. Use when user says "generate docs", "document this API", "create API documentation", or "make…

Emulated Sign in with Apple / Apple OIDC for local development and testing. Use when the user needs to test Apple sign-in locally, emulate Apple OIDC…

Query the Next.js documentation RAG API for the topic: $ARGUMENTS

Migrate an Astro application from Webflow Cloud to Vercel. Use this skill when a user wants to move, migrate, or port an Astro app off Webflow Cloud onto…

Authentication integration guidance — Clerk (native Vercel Marketplace), Descope, and Auth0 setup for Next.js applications. Covers middleware auth patterns,…

Auth and store debugging for vercel-openclaw: admin-secret mode, Sign in with Vercel, session cookies, CSRF, LOCAL_READ_ONLY, Redis vs memory store, keyspace…

Use this skill when creating or modifying agent skills in .agents/skills/ .

Automate and inspect running zero-native WebView shell apps via the built-in automation server. Use when the user asks to test the app, list windows, take a…

CLI tool for automated changeset-based releases with AI-generated descriptions. Use when the user needs to release a package, create changesets, bump versions,…

Emulated AWS cloud services (S3, SQS, IAM, STS) for local development and testing. Use when the user needs to interact with AWS API endpoints locally, test S3…

Backport a merged Next.js pull request from canary to a previous release branch such as next-16-2. Use when the user asks to backport, cherry-pick, or open a…

Validates animation durations, enforces typography scale, checks component accessibility, and prevents layout anti-patterns in Tailwind CSS projects. Use when…

Visual comparison of web pages or elements across two URLs or images. Captures screenshots at desktop, mobile (375x812), or tablet (768x1024) viewports, with optional full-page scrolling Supports CSS selectors to isolate specific elements, and accepts file://, http://, https:// URLs or local image paths Generates markdown-formatted output with automatic image upload to 0x0.st (or GitHub Gist) for easy PR integration Includes Vercel deployment protection detection and GitHub CLI integration...

Advanced AI agent benchmark scenarios that push Vercel's cutting-edge platform features — Workflow DevKit, AI Gateway, MCP, Chat SDK, Queues, Flags, Sandbox,…

End-to-end benchmark suite for vercel-plugin. Runs realistic projects through skill injection, launches dev servers, verifies everything works, analyzes…

Run vercel-plugin eval scenarios in Vercel Sandboxes instead of local WezTerm panels. Provisions ephemeral microVMs with Claude Code + plugin pre-installed,…

Create and launch benchmark test projects to exercise vercel-plugin skill injection across realistic scenarios. Sets up isolated directories, installs the…

Project bootstrapping orchestrator for repos that depend on Vercel-linked resources (databases, auth, and managed integrations). Use when setting up or…

Build or adapt a Shopify storefront with Vercel Shop source-backed patterns. Use when creating, redesigning, refactoring, or reviewing storefront routes,…

Companion skill for the Building Agents with eve course on Vercel Academy. Use when the user mentions "building agents with eve", "the eve course", "the bike…

Comprehensive guide for building modern, accessible, and composable UI components. Covers component taxonomy (primitives, components, blocks, templates), core design principles, and accessibility implementation including ARIA, keyboard navigation, and WCAG compliance Includes patterns for composable APIs, polymorphism, controlled/uncontrolled state, and the as-child pattern for flexible element composition Provides guidance on design tokens, theming systems, styling approaches, and using...

Expert guidance for Next.js Cache Components and Partial Prerendering (PPR). **PROACTIVE ACTIVATION**: Use this skill automatically when working in Next.js…

Store and manage API response test fixtures for provider parsing validation. Fixtures are organized in __fixtures__ subfolders within provider packages, using naming conventions documented in existing examples Supports two testing patterns: generateText (log raw response to console and copy into fixture) and streamText (use includeRawChunks and saveRawChunks helper to capture streaming chunks) Recommends storing true provider responses unless size constraints require semantic-preserving cuts...

Debug Vercel CDN caching — cache hit rate, stale content, revalidation behavior, ISR + PPR, per-request cache reasons (cacheReason), and costs.

Channel webhook triage for vercel-openclaw Slack/Telegram/Discord/WhatsApp issues: prove deployment state, collect admin readiness endpoints, build…

Webhook route parity audit for channel delivery changes: ensure terminal paths log, record lastForward, classify failures, and refresh stale sandbox port URLs.

Write chat bots once, deploy across Slack, Teams, Google Chat, Discord, GitHub, and Linear. Unified TypeScript SDK with platform-agnostic event handlers (mentions, messages, reactions, slash commands, actions) and normalized message format across all platforms Built-in streaming support for AI responses via AI SDK integration, plus JSX-based interactive cards with buttons, dropdowns, and form modals Pluggable state adapters for Redis, PostgreSQL, or in-memory persistence; webhook handlers...

Vercel Chat SDK expert guidance. Use when building multi-platform chat bots — Slack, Telegram, Microsoft Teams, Discord, Google Chat, GitHub, Linear — with a…

Unified TypeScript SDK for building chat bots across Slack, Teams, Google Chat, Discord, Telegram, GitHub, Linear, and WhatsApp. Write bot logic once, deploy everywhere.

Use for packages/cli changes that affect command UX, prompts, help, output layout, progress, success, warnings, errors, JSON/stdout/stderr contracts,…

Headless CMS integration guidance — Sanity (native Vercel Marketplace), Contentful, DatoCMS, Storyblok, and Builder.io. Covers studio setup, content modeling,…

Reviews code changes and provides actionable feedback. Use when the user asks to review a PR, diff, commit, or code changes. Triggers on "/review", "review…

Code generation utilities for json-render. Use when generating code from UI specs, building custom code exporters, traversing specs, or serializing props for…

React composition patterns that scale. Use when refactoring components with boolean prop proliferation, building flexible component libraries, or designing…

Schema definition, catalog creation, and AI prompt generation for json-render specs. Define schemas with typed specs and catalogs using defineSchema , then create catalogs mapping component names to their props and descriptions Generate AI system prompts from catalogs with optional custom rules; supports spec streaming via JSONL patches with createSpecStreamCompiler Dynamic prop expressions enable state binding ( $state , $bindState ), conditionals ( $cond ), templating ( $template ), and...

Comprehensive guide for migrating Create React App (CRA) projects to Next.js. Use when migrating a CRA app, converting React Router to file-based routing, or…

Create Remotion videos using the Geist design system aesthetic. Use when asked to create videos, animations, or motion graphics that should follow Vercel's…

Vercel Cron Jobs configuration and best practices. Use when adding, editing, or debugging scheduled tasks in vercel.json.

Cron and watchdog debugging for vercel-openclaw: Vercel Cron auth, persisted OpenClaw jobs, cron wake keys, token refresh, restore oracle, hot spare, and…

Analyze and transform CSV data using bash tools

Bootstrap d3k in standalone AI apps (Codex, Cursor, Claude Code): detect/install dev3000, start d3k as the runtime, and use unified logs plus CDP browser…

Use this skill when changing conditional require() paths, Node-only imports, or edge/runtime branching.

Run DeepSec against a Vercel project checkout from dev3000. Use for one-click DeepSec setup, project context bootstrapping, bounded first-pass processing, and…

Use deepsec (an AI-powered vulnerability scanner) — running scans, configuring projects, writing matchers, and authoring plugins. Activates when the user asks…

Deploy applications to Vercel. Use when the user says "deploy", "deploy to Vercel", "push to production", "deploy my app", or "go live".

Guides a user through collecting the credentials needed to deploy their own copy of Open Harness, deploying this repo on Vercel, and completing first-run…

Deploy applications and websites to Vercel with automatic git integration and preview URLs. Supports three deployment paths: git-push (ideal for linked projects), direct CLI deployment, and no-auth fallback for sandboxed environments Automatically detects project state (linked via .vercel/project.json or .vercel/repo.json , git remote presence, CLI authentication) and chooses the best deployment method Handles team selection for multi-team accounts and uses --scope to deploy to the correct...

Vercel deployment and CI/CD expert guidance. Use when deploying, promoting, rolling back, inspecting deployments, building with --prebuilt, or configuring CI…

Development and validation scripts for AI SDK functions across multiple providers and capabilities. Organized by AI SDK function category (text generation, streaming, structured output, embeddings, image generation, speech, transcription, reranking, and agents) File naming convention maps provider and feature combinations (e.g., openai-tool-call.ts , amazon-bedrock-anthropic-cache-control.ts ) for quick identification Includes shared utility helpers for error handling, environment loading,...

Drop-in inspector panel for any json-render app. Use when the user wants to debug a generative UI, inspect the spec tree, edit state at runtime, see dispatched…

Pre-built custom directives for json-render — formatting, math, string manipulation, and i18n. Use when working with @json-render/directives, defining custom…

Discord channel specialist workflow: debug interaction webhooks, Ed25519 signatures, deferred replies, workflow forwarding to /discord-webhook, integration…

Expert guidance for Vercel's Edge Runtime — the lightweight JavaScript runtime for Vercel Edge Functions and Middleware. Use when building or configuring edge…

Email sending integration guidance — Resend (native Vercel Marketplace) with React Email templates. Covers API setup, transactional emails, domain…

This skill encodes Emil Kowalski's philosophy on UI polish, component design, animation decisions, and the invisible details that make software feel great.

Local drop-in API emulator for Vercel, GitHub, Google, Slack, Apple, Microsoft, and AWS. Use when the user needs to start emulated services, configure seed…

Add Vercel Analytics, Vercel Speed Insights, and Google Tag Manager to the storefront.

Enable next-intl-based i18n in the shop template — locale-prefixed URLs, per-locale message catalogs, and a locale switcher. Use when the user wants "locale…

Wire Shopify metaobjects as the CMS for homepage and marketing page content. Adds GraphQL queries for cms_homepage and cms_page metaobject types and transforms…

Enable Shopify Markets with multi-locale routing using next-intl. Use when the user wants to add internationalization, multi-locale support, locale-prefixed…

Replace the hardcoded nav and footer menus with Shopify-powered menus.

Vercel environment variable expert guidance. Use when working with .env files, vercel env commands, OIDC tokens, or managing environment-specific configuration.

Build durable backend AI agents with the eve framework. Use when creating, editing, or debugging an eve project — agent instructions, skills, tools,…

Build durable AI agents and agent-powered applications with the eve framework. Use when creating, editing, or debugging an eve project, or when choosing…

Use Shopify AI Toolkit to inspect live Storefront and Customer Account GraphQL schemas for Vercel Shop work.

You are a knowledgeable teaching assistant for the Building Filesystem Agents course on Vercel Academy. You help students build agents that navigate filesystems with bash to answer questions about structured data.

Discover and install specialized agent skills from the open ecosystem when users need extended capabilities. Helps identify relevant skills by domain and task when users ask "how do I do X" or "find a skill for X" Integrates with the Skills CLI ( npx skills find , npx skills add ) to search, verify, and install packages from the skills.sh directory Recommends skills based on install count, source reputation, and GitHub stars to ensure quality before suggesting installation Presents skill...

Firewall and Vercel AI Gateway debugging for vercel-openclaw: network policy allowlists, OIDC token refresh, AI Gateway transform rules, firewall…

Use this skill when adding or changing framework feature flags in Next.js internals.

The Flags SDK ( flags npm package) is a feature flags toolkit for Next.js and SvelteKit. It turns each feature flag into a callable function, works with any flag provider via adapters, and keeps pages static using the precompute pattern. Vercel Flags is the first-party provider, letting you manage flags from the Vercel dashboard or the vercel flags CLI.

Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, artifacts,…

Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, artifacts,…

Gateway and proxy debugging for vercel-openclaw: /gateway routing, HTML injection, WebSocket rewrite, gateway-token handoff, waiting page, status heartbeat,…

Expert guidance for Geist, Vercel's default typography system and font family for precise Next.js interfaces. Use when configuring Geist Sans, Geist Mono, or…

Build explorative, interactive learning experiences as Next.js apps using the Geist design system. Use when creating tutorials, explorable explanations,…

Expert guidance for Geistdocs, Vercel's documentation template built with Next.js and Fumadocs — MDX authoring, configuration, AI chat, i18n, feedback,…

Emulated GitHub REST API for local development and testing. Use when the user needs to interact with GitHub API endpoints locally, test GitHub integrations,…

Add GitHub API tools to AI agents using @github-tools/sdk — AI SDK, eve, Vercel Workflow, and Chat SDK. Covers tools, presets, approval control, token scoping,…

Emulated Google OAuth 2.0, OpenID Connect, Gmail, Calendar, and Drive for local development and testing. Use when the user needs to test Google sign-in…

Use when building Hono web applications deployed to Vercel, or when the user asks about Hono APIs, routing, middleware, JSX, validation, testing, or streaming.…

Image renderer for json-render that turns JSON specs into SVG and PNG images via Satori. Use when working with @json-render/image, generating OG images from…

Initialize a new Vercel Shop storefront with the official create-vercel-shop CLI. Use when the user wants to create, scaffold, start, or initialize a Vercel…

Ink terminal renderer for json-render that turns JSON specs into interactive terminal UIs. Use when working with @json-render/ink, building terminal UIs from…

Spin up a portless + tmux dev session for the Workflow SDK that gives each git worktree isolated `<branch>.<name>.localhost` URLs for the Next.js workbench and…

Orchestrated debugging coordinator. Triggers on frustration signals (stuck, hung, broken, waiting) and systematically triages: runtime logs → workflow status →…

How to be rescued from a lonely island

Jotai adapter for json-render's StateStore interface. Use when integrating json-render with Jotai for state management via @json-render/jotai.

AI chat response rendering guidance — handling UIMessage parts, tool call displays, streaming states, and structured data presentation. Use when building…

Schema definition, catalog creation, and spec streaming for AI-driven JSON rendering. Define schemas with typed specs and component catalogs using defineSchema and defineCatalog ; generate AI prompts automatically or with custom rules Support dynamic prop expressions including state binding ( $state , $bindState ), conditionals ( $cond ), templates, and computed functions Stream AI responses as JSONL patches using createSpecStreamCompiler for progressive spec building Built-in validation,...

Image renderer for json-render that turns JSON specs into SVG and PNG images via Satori. Use when working with @json-render/image, generating OG images from…

Convert JSON specifications into type-safe React component trees with state management and dynamic expressions. Supports declarative UI specs with element trees, two-way data binding via $bindState , conditional rendering, and computed expressions Built-in state management through StateProvider with optional external store integration (Redux, Zustand, XState) and JSON Pointer-based state paths Event system with action dispatching, state watchers, and four built-in actions: setState ,...

React Email renderer for json-render that turns JSON specs into HTML or plain-text emails using @react-email/components and @react-email/render. Use when…

React Native renderer for json-render that turns JSON specs into native mobile UIs. Use when working with @json-render/react-native, building React Native UIs…

Remotion renderer for json-render that turns JSON timeline specs into videos. Use when working with @json-render/remotion, building video compositions from…

Pre-built shadcn/ui components for json-render. Use when working with @json-render/shadcn, adding standard UI components to a catalog, or building web UIs with…

Corrects outdated LLM knowledge about the Vercel platform and introduces new products. Injected at session start.

Create or modify a konsistent.json configuration file that enforces structural conventions in a TypeScript codebase. Use when the user wants to enforce…

Run the konsistent CLI, review all reported violations, and fix them in the codebase. Use when the user wants to "fix konsistent violations", "resolve…

Writing and maintaining lat.md documentation files — structured markdown that describes a project's architecture, design decisions, and test specs. Use when…

Launch verification and remote smoke debugging for vercel-openclaw: preflight, queue ping, ensureRunning, chatCompletions, wakeFromSleep, restorePrepared,…

Emulated Linear GraphQL API for local development and testing. Use when the user needs to test Linear integrations locally, emulate Linear issues, comments,…

Inspect npm package tarball contents before publishing to verify what files will be distributed. Lists exact files that would be uploaded to npm, helping catch missing or unwanted inclusions before publish Respects files field in package.json, .npmignore , and .gitignore rules to show the actual bundle contents Automatically builds the package, creates a tarball, displays contents, and cleans up in a single command Run from the package directory with a simple bash script; useful for...

View Vercel deployment logs. Use when the user says "show logs", "check logs", "vercel logs", or "what went wrong with the deployment".

Context for working on the next AI SDK major release. Only use when explicitly invoked by the user (e.g. via '/major-version-mode'). Do NOT trigger…

Vercel Marketplace expert guidance — discovering, installing, and building integrations, auto-provisioned environment variables, unified billing, and the…

Adds AI Skills integration (Brand Review API) to a Sitecore Marketplace app. Use when the user wants to add AI-powered content analysis, brand review, or brand…

Adds a new extension point route to a Sitecore Marketplace app. Use when the user wants to add a custom field, dashboard widget, context panel, fullscreen…

Adds XM Cloud API integration to a Sitecore Marketplace app. Use when the user wants to access Sites, Pages, Authoring, Content Transfer, Search, or Agent APIs…

Builds UI components using the Blok design system for Sitecore Marketplace apps. Use when the user wants to create UI, add components, build a page layout, or…

Deploys a Sitecore Marketplace app to Vercel with correct CSP headers and configuration.

Scaffolds a new Sitecore Marketplace app using the official SDK. Use when the user wants to create a new marketplace app, start a new Sitecore project, or…

Sitecore Marketplace SDK API reference. Use when the user asks about SDK methods, types, queries, mutations, subscriptions, or how to use any Sitecore…

MCP Apps integration for json-render. Use when building MCP servers that render interactive UIs in Claude, ChatGPT, Cursor, or VS Code, or when integrating…

Expert guidance for micro — asynchronous HTTP microservices framework by Vercel. Use when building lightweight HTTP servers, API endpoints, or microservices…

Emulated Microsoft Entra ID (Azure AD) OAuth 2.0 / OpenID Connect for local development and testing. Use when the user needs to test Microsoft sign-in locally,…

Migrate applications from AI SDK 6.x to AI SDK 7.0. Use when upgrading Vercel AI SDK packages, fixing v7 migration errors, or when the user mentions AI SDK v6,…

Migrates Temporal, Inngest, Trigger.dev, and AWS Step Functions workflows to the Workflow SDK. Use when porting Activities, Workers, Signals, step.run(),…

Discovery skill for the Native SDK, the complete toolkit for building native desktop applications - views are declarative Native markup (.native), logic is…

Expert guidance for @vercel/ncc — a simple CLI for compiling Node.js modules into a single file with all dependencies included. Use when bundling serverless…

Next.js adapter for embedding emulators directly in a Next.js app via @emulators/adapter-next. Use when the user needs to embed emulators in Next.js, set up…

Next.js renderer for json-render that turns JSON specs into full Next.js applications with routes, layouts, SSR, and metadata. Use when working with…

Next.js best practices - file conventions, RSC boundaries, data patterns, async APIs, metadata, error handling, route handlers, image/font optimization,…

Comprehensive Next.js development guidelines covering file structure, RSC patterns, data fetching, optimization, and error handling. Covers 15+ topic areas including file conventions, route segments, RSC boundaries, async patterns, metadata generation, and image/font optimization Provides runtime selection guidance, directive usage, and error handling strategies with specific file conventions like error.tsx and not-found.tsx Includes data fetching patterns, route handler best practices,...

Next.js best practices - file conventions, RSC boundaries, data patterns, async APIs, metadata, error handling, route handlers, image/font optimization,…

Next.js best practices - file conventions, RSC boundaries, data patterns, async APIs, metadata, error handling, route handlers, image/font optimization,…

If next-browser is not already on PATH, install @vercel/next-browser globally with the user's package manager, then playwright install chromium .

Next.js 16 Cache Components guidance — PPR, use cache directive, cacheLife, cacheTag, updateTag, and migration from unstable_cache. Use when implementing…

Mix static, cached, and dynamic content in a single Next.js route with Partial Prerendering. Enable with cacheComponents: true in next.config.ts ; replaces the old experimental.ppr flag Use the 'use cache' directive at file, component, or function level to cache async data with automatic key generation based on arguments and closures Control cache lifetime with cacheLife() using built-in profiles ( 'minutes' , 'hours' , 'days' , 'weeks' , 'max' ) or inline configuration with stale,...

Next.js 16 Cache Components - PPR, use cache directive, cacheLife, cacheTag, updateTag

Check Next.js compilation errors via a running dev server. Turbopack only. MANDATORY after every code edit before reporting work complete. Replaces `next…

next-forge expert guidance — production-grade Turborepo monorepo SaaS starter by Vercel. Use when working in a next-forge project, scaffolding with `npx…

Expert assistance for next-forge — a production-grade Turborepo template for Next.js SaaS apps. Triggers on questions about next-forge installation, setup,…

Upgrade Next.js to the latest version following official migration guides and codemods. Use when upgrading Next.js versions, running codemods, or migrating…

Automated Next.js version upgrades with official codemods and migration guide integration. Detects current Next.js version from package.json and fetches version-specific upgrade documentation from official guides Runs Next.js codemods automatically to handle breaking changes like async Request APIs, geo/IP property migrations, and dynamic import transformations Handles incremental upgrades for major version jumps (e.g., 13 → 14 → 15) and updates peer dependencies (React, React DOM,...

Upgrade Next.js to the latest version following official migration guides and codemods

Next.js App Router expert guidance. Use when building, debugging, or architecting Next.js applications — routing, Server Components, Server Actions, Cache…

Migrate a Next.js application from Webflow Cloud to Vercel. Use this skill when a user wants to move, migrate, or port a Next.js app off Webflow Cloud onto…

Structured diagnostic code library for JavaScript/TypeScript. Turns errors and other conditions into typed, machine-readable `Diagnostic` instances with stable…

Nuxt adapter for embedding emulators directly in a Nuxt app via @emulators/adapter-nuxt. Use when the user needs to embed emulators in Nuxt, set up same-origin…

Configure OAuth providers (Google, Apple, Microsoft, Facebook, GitHub, etc.) to work with portless local dev URLs. Use when setting up OAuth redirect URIs,…

Vercel Observability expert guidance — Drains (logs, traces, speed insights, web analytics), Web Analytics, Speed Insights, runtime logs, custom events,…

OpenClaw bootstrap, bundle, config, and restore-asset debugging for vercel-openclaw: openclaw.bundle sidecars, plugin discovery, channel catalog, restart…

Fetch dependency source code to give AI agents deeper implementation context. Use when the agent needs to understand how a library works internally, read…

Stripe payments integration guidance — native Vercel Marketplace setup, checkout sessions, webhook handling, subscription billing, and the Stripe SDK. Use when…

Use when building, reviewing, or optimizing web animations OR rendering performance (frame loops, scroll/viewport reveals, mount/unmount transitions,…

Holistic, system-aware planning before implementing non-trivial tasks. Use when the task involves new features, architectural decisions, multi-file changes,…

Audit vercel-plugin performance on real-world projects. Extracts tool calls from Claude Code conversation logs, tests hook matching against actual inputs,…

Named .localhost URLs for dev servers, eliminating port conflicts and hardcoded port numbers. Assigns random free ports (4000–4999) automatically and routes named subdomains (e.g. myapp.localhost:1355 ) to the correct app via a reverse proxy on port 1355 Auto-detects git worktrees and prepends branch names as subdomain prefixes so each worktree gets a unique URL without configuration changes Supports HTTP/2 with HTTPS via auto-generated local CA certificates; includes CLI commands for proxy...

Use this skill when the user asks about PR status, CI failures, or review comments in the Next.js monorepo.

Minimal WebGPU shader library for creative coding and real-time graphics. Provides fullscreen passes, particles, compute shaders, render targets, and ping-pong…

Convert JSON specs into React component trees with type-safe props and state management. Define catalogs with Zod schemas for component props, then implement components with automatic type safety and validation Built-in state management via StateProvider with two-way binding ( $bindState ), conditional rendering, and external store integration (Redux, Zustand, XState) Event system with action dispatching, state watchers, and four built-in actions (setState, pushState, removeState,...

React and Next.js performance optimization guidelines from Vercel Engineering. This skill should be used when writing, reviewing, or refactoring React/Next.js code to ensure optimal performance patterns. Triggers on tasks involving React components, Next.js pages, data fetching, bundle optimization, or performance improvements.

React best-practices reviewer for TSX files. Triggers after editing multiple TSX components to run a condensed quality checklist covering component structure,…

React Email renderer for json-render that turns JSON specs into HTML or plain-text emails using @react-email/components and @react-email/render. Use when…

React Native renderer for json-render that turns JSON specs into native mobile UIs. Use when working with @json-render/react-native, building React Native UIs…

React Native and Expo best practices for building performant mobile apps. Use when building React Native components, optimizing list performance, implementing…

React PDF renderer for json-render. Use when generating PDF documents from JSON specs, working with @json-render/react-pdf, or rendering specs to PDF…

React Three Fiber 3D renderer for json-render. Use when working with @json-render/react-three-fiber, building 3D scenes from JSON specs, rendering…

Use this skill for changes touching vendored React, react-server-dom-webpack/* , or react-server layer boundaries.

Redux adapter for json-render's StateStore interface. Use when integrating json-render with Redux or Redux Toolkit for state management via @json-render/redux.

Release vercel-plugin — run gates, bump version, generate artifacts, commit, and push. Use when asked to "release", "ship", "bump and push", or "cut a release".

Remotion renderer for json-render that turns JSON timeline specs into videos. Use when working with @json-render/remotion, building video compositions from…

Best practices for Remotion - Video creation in React

Removes Open Harness hosted demo restrictions from a fork. Use when a maintainer wants to remove managed-template trial caps, hosted deployment gating, or…

Emulated Resend email API for local development and testing. Use when the user needs to send emails locally, test transactional email flows, implement magic…

Use this skill when writing or modifying tests that involve prefetch requests, client router navigations, or the segment cache. The createRouterAct utility from test/lib/router-act.ts lets you assert on prefetch and navigation responses in an end-to-end way without coupling to the exact number of requests or the protocol details. This is why most client router-related tests use this pattern.

Vercel Routing Middleware guidance — request interception before cache, rewrites, redirects, personalization. Works with any framework. Supports Edge, Node.js,…

Vercel Runtime Cache API guidance — ephemeral per-region key-value cache with tag-based invalidation. Shared across Functions, Routing Middleware, and Builds.…

Use this skill when reproducing runtime-bundle, module-resolution, or user-bundle inclusion regressions.

Creates isolated Linux MicroVMs using Vercel Sandbox SDK. Use when building code execution environments, running untrusted code, spinning up dev servers,…

Sandbox lifecycle debugging for vercel-openclaw: create, resume, stop, snapshotting, reset, stale-running reconciliation, persistent Sandbox v2 behavior, hot…

Vercel Sandbox v2 lifecycle expertise for vercel-openclaw: named persistent OpenClaw sandbox create/resume/stop/delete, persistent auto-save truth, manual…

Expert guidance for Satori — Vercel's library that converts HTML and CSS to SVG, commonly used to generate dynamic OG images for Next.js and other frameworks.

Set up Vercel CLI and project configuration. Use when the user says "set up Vercel", "configure Vercel", "link to Vercel", or "vercel init".

shadcn/ui expert guidance — CLI, component installation, composition patterns, custom registries, theming, Tailwind CSS integration, and high-quality interface…

Pre-built shadcn/ui components for json-render. Use when working with @json-render/shadcn, adding standard UI components to a catalog, or building web UIs with…

Pre-built shadcn-svelte components for json-render Svelte apps. Use when working with @json-render/shadcn-svelte, adding standard UI components to a Svelte…

Integrate Shopify-validated Storefront or Customer Account GraphQL into Vercel Shop. Use after Shopify AI Toolkit has supplied and validated an API operation,…

Sign in with Vercel guidance — OAuth 2.0/OIDC identity provider for user authentication via Vercel accounts. Use when implementing user login with Vercel as…

Guide for creating effective skills. This skill should be used when users want to create a new skill (or update an existing skill) that extends Claude's…

Guide for creating effective skills. This skill should be used when users want to create a new skill (or update an existing skill) that extends Claude's…

Emulated Slack API for local development and testing. Use when the user needs to interact with Slack API endpoints locally, test Slack integrations, emulate…

Use when working on Slack agent/bot code, Chat SDK applications, Bolt for JavaScript projects, or projects using @chat-adapter/slack or @slack/bolt. Provides…

Slack channel specialist workflow: debug Slack OAuth vs delivery-ready, /slack/events fast path, raw-body signatures, route repair, boot-message cleanup, and…

SolidJS renderer for json-render. Use when building @json-render/solid catalogs/registries, wiring Renderer providers, implementing bindings/actions, or…

Streamdown streaming-markdown expert guidance. Use when rendering streaming Markdown from AI models, building chat UIs with real-time content, or replacing…

Streaming-optimized React Markdown renderer with syntax highlighting, diagrams, math, and AI chat integration. Supports four optional plugins: code syntax highlighting via Shiki (200+ languages), Mermaid diagrams, LaTeX math rendering, and CJK text support Two rendering modes: streaming (with animated caret cursor for AI chat) and static (for blogs and documentation) Built-in security features including link safety modals, HTML tag filtering, URL sanitization, and configurable element...

Emulated Stripe API for local development and testing. Use when the user needs to process payments locally, test checkout flows, create customers, manage…

Expert guidance for styled-jsx — scoped CSS-in-JS for React and Next.js. Use when writing component-scoped styles with the styled-jsx babel plugin, using…

Svelte 5 renderer for json-render that turns JSON specs into Svelte component trees. Use when working with @json-render/svelte, building Svelte UIs from JSON,…

SWR data-fetching expert guidance. Use when building React apps with client-side data fetching, caching, revalidation, mutations, optimistic UI, pagination, or…

Migrate a TanStack Start application from Cloudflare Workers to Vercel. Use this skill when a user wants to move, migrate, or port a TanStack Start (or…

Migrate a TanStack Start application from Netlify to Vercel. Use this skill when a user wants to move, migrate, or port a TanStack Start (or TanStack) app off…

Telegram channel specialist workflow: debug /api/channels/telegram/webhook, native port 8787 /telegram-webhook, webhookSecret, boot cleanup, and post-accept…

Analyze and transform text files using bash tools

Turbopack expert guidance. Use when configuring the Next.js bundler, optimizing HMR, debugging build issues, or understanding the Turbopack vs Webpack…

Turborepo expert guidance. Use when setting up or optimizing monorepo builds, configuring task caching, remote caching, parallel execution, or the --affected…

Monorepo build system with intelligent task caching, parallel execution, and dependency graph orchestration. Caches task outputs and runs tasks in parallel based on declared dependencies; supports remote caching for CI/CD workflows Filters and runs only changed packages with --affected , or use --filter for custom package selection Configures tasks in turbo.json with dependsOn , outputs , inputs , and env keys; supports package-specific overrides via Package Configurations Enforces monorepo...

Semantic spacing system for Tailwind CSS v4 using block (32px) and tab (4px) units. Use when building UIs with consistent spacing, dashboards, admin panels,…

Emulated Twilio REST APIs for local development and testing. Use when the user needs to test Twilio Messaging, Verify, Voice, phone numbers, webhooks, status…

When cloning is needed:

Guided workflow for updating Next.js documentation based on code changes and PR reviews. Analyzes git diffs to identify affected documentation files using a code-to-docs mapping reference Provides templates and conventions for scaffolding new feature docs (components, functions, config, guides, file conventions) Walks through step-by-step updates to existing documentation with user confirmation before each change Includes validation checklist and linting commands to ensure formatting...

Add new or remove obsolete model IDs for existing AI SDK providers. Use when adding a model to a provider, removing an obsolete model, or processing a list of…

Update an existing Vercel Shop storefront with newer template changes. Use when the user wants to check drift, plan an upgrade, or apply template updates to a…

v0 by Vercel expert guidance. Use when discussing AI code generation, generating UI components from prompts, v0 CLI usage, v0 SDK/API integration, or…

Use this skill when writing or optimizing performance-critical code paths in Next.js server internals — especially per-request hot paths like rendering, streaming, routing, and caching.

Emulated Vercel REST API for local development and testing. Use when the user needs to interact with Vercel API endpoints locally, test Vercel integrations,…

Deploy applications and websites to Vercel. Use this skill when the user requests deployment actions such as "Deploy my app", "Deploy this to production", "Create a preview deployment", "Deploy and give me the link", or "Push this live". No authentication required - returns preview URL and claimable deployment link.

Vercel Agent guidance — AI-powered code review, incident investigation, and SDK installation. Automates PR analysis and anomaly debugging. Use when configuring…

Vercel AI SDK (Python) - patterns for building LLM-powered apps with streaming, tools, hooks, and structured output

Vercel MCP and REST API expert guidance. Use when the agent needs live access to Vercel projects, deployments, environment variables, domains, logs, or…

Vercel CLI expert guidance. Use when deploying, managing environment variables, linking projects, viewing logs, querying metrics, managing domains, or…

Command-line interface for deploying, managing, and developing Vercel projects locally and in CI/CD pipelines. Requires explicit project linking via vercel link (single project) or vercel link --repo (monorepos); commands must run from the directory containing .vercel/ folder Core workflows: vercel dev for local development, vercel deploy for preview deployments, vercel --prod for production Supports environment variables, domains, DNS, blob storage, integrations, Node.js backends,...

Deploy and manage projects on Vercel using token-based authentication. Use when working with Vercel CLI using access tokens rather than interactive login —…

React composition patterns that scale. Use when refactoring components with boolean prop proliferation, building flexible component libraries, or designing…

React composition patterns for scaling components and avoiding boolean prop proliferation. Covers four priority categories: component architecture, state management, implementation patterns, and React 19 APIs, each with specific rules and code examples Includes 10+ named patterns addressing compound components, context providers, state lifting, and explicit variants Designed for refactoring bloated components, building reusable libraries, and reviewing component architecture decisions React...

vercel-composition-patterns — an installable skill for AI agents, published by vercel-labs/openreview.

Deploy applications and websites to Vercel with a claimable preview. Use when the user requests deployment actions like "deploy my app", "deploy and give me…

Vercel Firewall expert guidance — automatic DDoS mitigation, the Vercel WAF (custom rules, IP blocking, managed rulesets, rate limiting), Attack Mode, system…

Vercel Flags guidance — feature flags platform with unified dashboard, Flags Explorer, gradual rollouts, A/B testing, and provider adapters. Use when…

Vercel Functions expert guidance — Serverless Functions, Edge Functions, Fluid Compute, streaming, Cron Jobs, and runtime configuration. Use when configuring,…

Guide for building, configuring, and deploying microfrontends on Vercel. Use this skill when the user mentions microfrontends, multi-zones, splitting an app…

Use for Vercel cost and performance optimization on deployed projects, especially Next.js, SvelteKit, Nuxt, and limited Astro apps. Collect Vercel metrics, usage, project config, and code scan results first; investigate only metric-backed candidates; produce ranked recommendations grounded in verified files and version-aware Vercel/framework docs. Trigger for Vercel bill reduction, slow or expensive routes, caching opportunities, Function Invocations, Build Minutes, Fast Data Transfer, Core...

Run live eval sessions against the vercel-plugin to verify hook behavior, skill injection, dedup correctness, and coverage. Launches real Claude Code sessions…

Building Python backend services using Vercel's experimentalServices API. Use when creating Python backends, or multi-service projects with a Python backend…

Vercel Queues guidance (public beta) — durable event streaming with topics, consumer groups, retries, and delayed delivery. $0.60/1M ops. Powers Workflow…

React and Next.js performance optimization guidelines from Vercel Engineering. This skill should be used when writing, reviewing, or refactoring React/Next.js…

React and Next.js performance optimization guidelines from Vercel Engineering. This skill should be used when writing, reviewing, or refactoring React/Next.js…

React and Next.js performance optimization guidelines from Vercel Engineering. This skill should be used when writing, reviewing, or refactoring React/Next.js…

React and Next.js performance optimization guidelines from Vercel Engineering. This skill should be used when writing, reviewing, or refactoring React/Next.js…

React and Next.js performance optimization guidelines from Vercel Engineering. This skill should be used when writing, reviewing, or refactoring React/Next.js…

React and Next.js performance optimization guidelines from Vercel Engineering. This skill should be used when writing, reviewing, or refactoring React/Next.js…

React Native and Expo best practices for performant mobile apps across list rendering, animations, navigation, and native modules. Covers eight rule categories prioritized by impact: list performance (FlashList, memoization, callback stability), animations (GPU properties, derived values), navigation, UI patterns, state management, rendering, monorepo structure, and configuration List performance rules address critical concerns like virtualizing large lists, optimizing images, and avoiding...

React Native and Expo best practices for building performant mobile apps. Use

Guide for implementing smooth, native-feeling animations using React's View Transition API (`<ViewTransition>` component, `addTransitionType`, and CSS view…

Vercel Sandbox guidance — ephemeral Firecracker microVMs for running untrusted code safely. Supports AI agents, code generation, and experimentation. Use when…

Vercel Services — deploy multiple services within a single Vercel project. Use for monorepo layouts or when combining a backend (Python, Go) with a frontend…

Vercel storage expert guidance — Blob, Edge Config, and Marketplace storage (Neon Postgres, Upstash Redis). Use when choosing, configuring, or using data…

Full-story verification — infers what the user is building, then verifies the complete flow end-to-end: browser → API → data → response. Triggers on dev server…

Vue 3 renderer for json-render. Use when building Vue UIs from JSON specs, working with @json-render/vue, defining Vue component registries, or rendering…

Review UI code for Web Interface Guidelines compliance. Use when asked to "review my UI", "check accessibility", "audit design", "review UX", or "check my site against best practices".

web-animation-design — an installable skill for AI agents, published by vercel-labs/open-agents.

Review UI code for Web Interface Guidelines compliance. Use when asked to "review my UI", "check accessibility", "audit design", "review UX", or "check my site…

Review UI code for Web Interface Guidelines compliance. Use when asked to "review my UI", "check accessibility", "audit design", "review UX", or "check my site…

Review UI code for Web Interface Guidelines compliance. Use when asked to "review my UI", "check accessibility", "audit design", "review UX", or "check my site…

Review UI code for Web Interface Guidelines compliance. Use when asked to "review my UI", "check accessibility", "audit design", "review UX", or "check my site…

Create and record scripted browser demo videos with webreel. Generates MP4, GIF, or WebM recordings with cursor animation, keystroke overlays, and sound…

WhatsApp channel specialist workflow: debug Meta webhook verification/signatures, link-state projection, /whatsapp-webhook fast path, boot messages, and…

Vercel Workflow DevKit (WDK) expert guidance. Use when building durable workflows, long-running tasks, API routes or agents that need pause/resume, retries,…

Creates durable, resumable workflows using Vercel's Workflow DevKit. Use when building workflows that need to survive restarts, pause for external events,…

Durable, resumable workflows with step-based orchestration, hooks for external events, and built-in AI agent support. Supports three execution modes: workflow functions (orchestration layer), step functions (full Node.js access with automatic retry and result persistence), and DurableAgent for AI-powered workflows with tool integration Pause workflows at hooks to wait for external events, then resume from API routes; hooks support single events or iterable multi-event patterns with...

Install and configure Vercel Workflow SDK before it exists in node_modules. Use when the user asks to "install workflow", "set up workflow", "add durable…

Produce an API reference page that documents a single API surface (function, component, file convention, directive, or config option). The page should be concise, scannable, and example-driven.

Produce a technical guide that teaches a real-world use case through progressive examples. Concepts are introduced only when the reader needs them.

Review docs/prose for Writing Guidelines compliance. Use when asked to "review my docs", "check writing style", "audit prose", "review docs voice and tone", or "check this page against the writing handbook".

XState Store adapter for json-render's StateStore interface. Use when integrating json-render with @xstate/store for state management via @json-render/xstate.

YAML wire format for json-render with streaming parser, prompt generation, and AI SDK transform. Use when working with @json-render/yaml, YAML-based spec…

Install Zero and load version-matched workflows with zero skills.

Discovery skill for zero-native, a Zig desktop app shell for building native apps with web UIs. Use when the user asks what zero-native is, how to build a…

Zustand adapter for json-render's StateStore interface. Use when integrating json-render with Zustand for state management via @json-render/zustand.