Development
vercel-labs-agent-skills
A collection of skills for AI coding agents. Skills are packaged instructions and scripts that extend agent capabilities. Skills follow the Agent Skills format.
Install
$ npx -y skills add vercel-labs/agent-skills --agent claude-code
Run the curl in your terminal, the rest in Claude Code.
Stats
30,090
Stars
2,684
Forks
Active
Maintenance
JavaScript
Language
1d ago
Last commit
8mo ago
Created
1mo ago
Added
Repo: vercel-labs/agent-skills
What's inside
Skills
9/composition-patternsComposition patterns for building flexible, maintainable React components. Avoid boolean prop proliferation by using compound components, lifting state, and composing internals. These patterns make codebases easier for both humans and AI agents to work with as they scale./deploy-to-vercelDeploy applications and websites to Vercel. Use when the user requests deployment actions like "deploy my app", "deploy and give me the link", "push this live", or "create a preview deployment"./react-best-practicesReact 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,/react-native-skillsComprehensive best practices for React Native and Expo applications. Contains rules across multiple categories covering performance, animations, UI patterns, and platform-specific optimizations./react-view-transitionsGuide for implementing smooth, native-feeling animations using React's View Transition API (`<ViewTransition>` component, `addTransitionType`, and CSS view transition pseudo-elements). Use this skill whenever the user wants to add page transitions, animate route changes, create/vercel-cli-with-tokensDeploy and manage projects on Vercel using token-based authentication. Use when working with Vercel CLI using access tokens rather than interactive login — e.g. "deploy to vercel", "set up vercel", "add environment variables to vercel".
Show all 9 skillsShow fewer
/vercel-optimizeUse 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/web-design-guidelinesReview 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"./writing-guidelinesReview 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".
README
1Agent Skills
A collection of skills for AI coding agents. Skills are packaged instructions and scripts that extend agent capabilities.
Skills follow the Agent Skills format.
Available Skills
vercel-optimize
Audits a Vercel project for cost, performance, reliability, caching, function usage, and billing opportunities. It collects Vercel metrics first, then investigates only the routes and files those metrics point to.
Use when:
- Optimizing a deployed Vercel project
- Reducing Vercel costs or function usage
- Investigating slow or expensive routes
- Finding caching, ISR, middleware, image, or build-minute issues
- Producing a ranked cost and performance report
react-best-practices
React and Next.js performance optimization guidelines from Vercel Engineering. Contains 40+ rules across 8 categories, prioritized by impact.
Use when:
- Writing new React components or Next.js pages
- Implementing data fetching (client or server-side)
- Reviewing code for performance issues
- Optimizing bundle size or load times
Categories covered:
- Eliminating waterfalls (Critical)
- Bundle size optimization (Critical)
- Server-side performance (High)
- Client-side data fetching (Medium-High)
- Re-render optimization (Medium)
- Rendering performance (Medium)
- JavaScript micro-optimizations (Low-Medium)
web-design-guidelines
Review UI code for compliance with web interface best practices. Audits your code for 100+ rules covering accessibility, performance, and UX.
Use when:
- "Review my UI"
- "Check accessibility"
- "Audit design"
- "Review UX"
- "Check my site against best practices"
Categories covered:
- Accessibility (aria-labels, semantic HTML, keyboard handlers)
- Focus States (visible focus, focus-visible patterns)
- Forms (autocomplete, validation, error handling)
- Animation (prefers-reduced-motion, compositor-friendly transforms)
- Typography (curly quotes, ellipsis, tabular-nums)
- Images (dimensions, lazy loading, alt text)
- Performance (virtualization, layout thrashing, preconnect)
- Navigation & State (URL reflects state, deep-linking)
- Dark Mode & Theming (color-scheme, theme-color meta)
- Touch & Interaction (touch-action, tap-highlight)
- Locale & i18n (Intl.DateTimeFormat, Intl.NumberFormat)
writing-guidelines
Review docs and prose for compliance with the Vercel writing handbook. Audits your pages for 80+ rules covering voice, structure, content types, code samples, typography, and AI workflow.
Use when:
- "Review my docs"
- "Check writing style"
- "Audit prose"
- "Review docs voice and tone"
- "Check this page against the writing handbook"
Categories covered:
- Planning (content plan, content type, user-shaped titles)
- Voice & tone (active voice, direct address, banned words like
easy/simple/quick) - Tone by content type (tutorial, how-to, reference, conceptual, troubleshooting)
- Headings & structure (sentence case, descriptive subheadings, TL;DR opens)
- Lists (when to use, bold/description format)
- Code (language tags, TypeScript first,
<Steps/>, 80-col / 25-line limits) - Placeholders, units, & numbers (
snake_casetext, count-up numbers,64 KB/200 ms) - Typography (no em dashes as punctuation, curly quotes, ellipsis character, non-breaking spaces)
- Source formatting (no hard-wrap, no
---rules, blank line discipline) - Pricing & money pages (tables, uncompromising detail)
- AI workflow (accountability, enterprise models, plan first, disclose AI use)
- Review (PR description discipline, author accountability)
react-native-guidelines
React Native best practices optimized for AI agents. Contains 16 rules across 7 sections covering performance, architecture, and platform-specific patterns.
Use when:
- Building React Native or Expo apps
- Optimizing mobile performance
- Implementing animations or gestures
- Working with native modules or platform APIs
Categories covered:
- Performance (Critical) - FlashList, memoization, heavy computation
- Layout (High) - flex patterns, safe areas, keyboard handling
- Animation (High) - Reanimated, gesture handling
- Images (Medium) - expo-image, caching, lazy loading
- State Management (Medium) - Zustand patterns, React Compiler
- Architecture (Medium) - monorepo structure, imports
- Platform (Medium) - iOS/Android specific patterns
react-view-transitions
Implement smooth, native-feeling animations using React's View Transition API. Covers the <ViewTransition> component, addTransitionType, transition types, and Next.js integration including the transitionTypes prop on next/link.
Use when:
- Adding page transitions or route animations
- Animating enter/exit of components
- Creating shared element transitions (list-to-detail morphing)
- Implementing directional (forward/back) navigation animations
- Integrating view transitions in Next.js App Router
- Animating list reorder or Suspense fallback reveals
Topics covered:
<ViewTransition>component (enter, exit, update, share triggers)addTransitionTypefor directional/context-specific animations- View Transition Classes and CSS pseudo-elements
- Shared element transitions with the
nameprop - JavaScript animations via Web Animations API
- Next.js
transitionTypesprop onnext/link - Ready-to-use CSS animation recipes (fade, slide, scale, flip)
- Accessibility (
prefers-reduced-motion)
composition-patterns
React composition patterns that scale. Helps avoid boolean prop proliferation through compound components, state lifting, and internal composition.
Use when:
- Refactoring components with many boolean props
- Building reusable component libraries
- Designing flexible APIs
- Reviewing component architecture
Patterns covered:
- Extracting compound components
- Lifting state to reduce props
- Composing internals for flexibility
- Avoiding prop drilling
vercel-deploy-claimable
Deploy applications and websites to Vercel instantly. Designed for use with claude.ai and Claude Desktop to enable deployments directly from conversations. Deployments are "claimable" - users can transfer ownership to their own Vercel account.
Use when:
- "Deploy my app"
- "Deploy this to production"
- "Push this live"
- "Deploy and give me the link"
Features:
- Auto-detects 40+ frameworks from
package.json - Returns preview URL (live site) and claim URL (transfer ownership)
- Handles static HTML projects automatically
- Excludes
node_modulesand.gitfrom uploads
How it works:
- Packages your project into a tarball
- Detects framework (Next.js, Vite, Astro, etc.)
- Uploads to deployment service
- Returns preview URL and claim URL
Output:
Deployment successful!
Preview URL: https://skill-deploy-abc123.vercel.app
Claim URL: https://vercel.com/claim-deployment?code=...
Installation
npx skills add vercel-labs/agent-skills
Usage
Skills are automatically available once installed. The agent will use them when relevant tasks are detected.
Examples:
Deploy my app
Review this React component for performance issues
Help me optimize this Next.js page
Skill Structure
Each skill contains:
SKILL.md- Instructions for the agentscripts/- Helper scripts for automation (optional)references/- Supporting documentation (optional)
License
MIT
File tree
442vercel-labs/agent-skillsView on GitHub
.github/
workflows/
react-best-practices-ci.yml
.gitignore
AGENTS.md
CLAUDE.md
packages/
react-best-practices-build/
.gitignore
package.json
pnpm-lock.yaml
src/
build.ts
config.ts
extract-tests.ts
migrate.ts
parser.ts
types.ts
validate.ts
test-cases.json
tsconfig.json
vercel-optimize-tests/
package.json
test/
account-scope-grading.test.mjs
budget-summary.test.mjs
build-minutes-fanout.test.mjs
cache-components-suspense-dedupe.test.mjs
check-citations-script.test.mjs
citations.test.mjs
cold-start-revival.test.mjs
collect-framework-preflight.test.mjs
collect-sub-agent-outputs.test.mjs
collection-command-docs.test.mjs
cost-coverage.test.mjs
dedup-recs.test.mjs
deep-dive-extract.test.mjs
deep-dive.test.mjs
display-labels.test.mjs
edge-heavy-import.test.mjs
fixtures/
real-cli-output/
contract-commitments-empty-200.txt
contract-empty-commitments.json
deep-dive/
README.md
slow_route_latency_p95.json
slow_route_perDeployment.json
slow_route_startTypeSplit.json
slow_route_statusDist.json
uncached_route_cacheBreakdown.json
metrics-bot-id-checks.json
metrics-cwv-cls-by-route.json
metrics-cwv-count-by-route.json
metrics-cwv-count.json
metrics-cwv-inp-by-route.json
metrics-cwv-lcp-by-route.json
metrics-cwv-ttfb-by-route.json
metrics-error-invalid-dimension.json
metrics-ext-api-p75.json
metrics-external-api-bytes.json
metrics-external-api-count.json
metrics-fdt-by-bot.json
metrics-fdt-by-cache.json
metrics-fdt-by-route.json
metrics-firewall-by-action.json
metrics-fn-count-by-route-http-status.json
metrics-fn-cpu-by-route.json
metrics-fn-duration-p95-by-route.json
metrics-fn-gbhr-by-route.json
metrics-fn-peak-memory-by-route.json
metrics-fn-provisioned-memory-by-route.json
metrics-fn-start-type-by-route.json
metrics-fn-ttfb-p95-by-route.json
metrics-image-by-host.json
metrics-image-count.json
metrics-image-source-bytes.json
metrics-isr-reads-by-route.json
metrics-isr-writes-by-route.json
metrics-middleware-count.json
metrics-middleware-duration-p95.json
metrics-request-count-by-route-method.json
metrics-request-count-group-by-http-status.json
metrics-request-count-group-by-route-cache.json
metrics-request-count-group-by-route.json
metrics-request-count-since-30d.json
metrics-schema.json
project-v9.json
README.md
usage-404-stderr.txt
signals.hobby.json
signals.pro-oplus.json
flags-gate.test.mjs
framework-support.test.mjs
gate-contract.test.mjs
gate-selection.test.mjs
gate.test.mjs
grade-and-verify.test.mjs
hallucination-probe.test.mjs
impact-label.test.mjs
impact-magnitude.test.mjs
infer-plan.test.mjs
investigation-brief.test.mjs
large-static-asset.test.mjs
merge-signals.test.mjs
new-gates.test.mjs
observability-events-attribution.test.mjs
observability-preflight.test.mjs
observations.test.mjs
oplus-diagnose.test.mjs
prepare-investigation-brief-cli.test.mjs
project-config-contradict.test.mjs
project-facts.test.mjs
public-release-safety.test.mjs
queries.test.mjs
reconcile-candidates-cli.test.mjs
reconcile-candidates.test.mjs
reconcile-pipeline.test.mjs
region-misconfig.test.mjs
region-pin-in-config.test.mjs
render-report.test.mjs
repo-root.test.mjs
route-errors.test.mjs
route-normalize.test.mjs
route-shape-warnings.test.mjs
sanitizers.test.mjs
scan-codebase-layouts.test.mjs
slow-route-5xx-disqualify.test.mjs
support-topics.test.mjs
sveltekit-parity.test.mjs
throttle.test.mjs
time-window.test.mjs
turbo-force-bypass.test.mjs
uncached-route-method-filter.test.mjs
unoptimized-image-ext.test.mjs
usage-spike-triage.test.mjs
use-cache-date-stamp.test.mjs
vercel-command.test.mjs
vercel-redaction.test.mjs
verify-and-regen-cli.test.mjs
voice-drift.test.mjs
workspace-resolver.test.mjs
README.md
skills/
skills.sh.json
composition-patterns/
AGENTS.md
metadata.json
README.md
rules/
_sections.md
_template.md
architecture-avoid-boolean-props.md
architecture-compound-components.md
patterns-children-over-render-props.md
patterns-explicit-variants.md
react19-no-forwardref.md
state-context-interface.md
state-decouple-implementation.md
state-lift-state.md
SKILL.md
deploy-to-vercel/
deploy-to-vercel.zip
Archive.zip
resources/
deploy-codex.sh
deploy.sh
SKILL.md
react-best-practices/
react-best-practices.zip
AGENTS.md
metadata.json
README.md
rules/
_sections.md
_template.md
advanced-effect-event-deps.md
advanced-event-handler-refs.md
advanced-init-once.md
advanced-use-latest.md
async-api-routes.md
async-cheap-condition-before-await.md
async-defer-await.md
async-dependencies.md
async-parallel.md
async-suspense-boundaries.md
bundle-analyzable-paths.md
bundle-barrel-imports.md
bundle-conditional.md
bundle-defer-third-party.md
bundle-dynamic-imports.md
bundle-preload.md
client-event-listeners.md
client-localstorage-schema.md
client-passive-event-listeners.md
client-swr-dedup.md
js-batch-dom-css.md
js-cache-function-results.md
js-cache-property-access.md
js-cache-storage.md
js-combine-iterations.md
js-early-exit.md
js-flatmap-filter.md
js-hoist-regexp.md
js-index-maps.md
js-length-check-first.md
js-min-max-loop.md
js-request-idle-callback.md
js-set-map-lookups.md
js-tosorted-immutable.md
rendering-activity.md
rendering-animate-svg-wrapper.md
rendering-conditional-render.md
rendering-content-visibility.md
rendering-hoist-jsx.md
rendering-hydration-no-flicker.md
rendering-hydration-suppress-warning.md
rendering-resource-hints.md
rendering-script-defer-async.md
rendering-svg-precision.md
rendering-usetransition-loading.md
rerender-defer-reads.md
rerender-dependencies.md
rerender-derived-state-no-effect.md
rerender-derived-state.md
rerender-functional-setstate.md
rerender-lazy-state-init.md
rerender-memo-with-default-value.md
rerender-memo.md
rerender-move-effect-to-event.md
rerender-no-inline-components.md
rerender-simple-expression-in-memo.md
rerender-split-combined-hooks.md
rerender-transitions.md
rerender-use-deferred-value.md
rerender-use-ref-transient-values.md
server-after-nonblocking.md
server-auth-actions.md
server-cache-lru.md
server-cache-react.md
server-dedup-props.md
server-hoist-static-io.md
server-no-shared-module-state.md
server-parallel-fetching.md
server-parallel-nested-fetching.md
server-serialization.md
SKILL.md
react-native-skills/
AGENTS.md
metadata.json
README.md
rules/
_sections.md
_template.md
animation-derived-value.md
animation-gesture-detector-press.md
animation-gpu-properties.md
design-system-compound-components.md
fonts-config-plugin.md
imports-design-system-folder.md
js-hoist-intl.md
list-performance-callbacks.md
list-performance-function-references.md
list-performance-images.md
list-performance-inline-objects.md
list-performance-item-expensive.md
list-performance-item-memo.md
list-performance-item-types.md
list-performance-virtualize.md
monorepo-native-deps-in-app.md
monorepo-single-dependency-versions.md
navigation-native-navigators.md
react-compiler-destructure-functions.md
react-compiler-reanimated-shared-values.md
react-state-dispatcher.md
react-state-fallback.md
react-state-minimize.md
rendering-no-falsy-and.md
rendering-text-in-text-component.md
scroll-position-no-state.md
state-ground-truth.md
ui-expo-image.md
ui-image-gallery.md
ui-measure-views.md
ui-menus.md
ui-native-modals.md
ui-pressable.md
ui-safe-area-scroll.md
ui-scrollview-content-inset.md
ui-styling.md
SKILL.md
react-view-transitions/
react-view-transitions.zip
AGENTS.md
metadata.json
README.md
references/
css-recipes.md
implementation.md
nextjs.md
patterns.md
SKILL.md
vercel-cli-with-tokens/
vercel-cli-with-tokens.zip
SKILL.md
vercel-optimize/
AGENTS.md
CONTRIBUTING.md
lib/
auth-route.mjs
budget-summary.mjs
citations.mjs
cost-coverage.mjs
dedup-recs.mjs
deep-dive.mjs
display-labels.mjs
extract-claims.mjs
framework-support.mjs
gates/
build-minutes-fanout.mjs
cold-start.mjs
contract.mjs
cwv-poor.mjs
external-api-slow.mjs
hard-gates.mjs
index.mjs
isr-overrevalidation.mjs
middleware-heavy.mjs
observability-events-attribution.mjs
platform-bot-protection.mjs
platform-fluid-compute.mjs
region-misconfig.mjs
route-errors.mjs
scanner-driven.mjs
select-candidates.mjs
slow-route.mjs
types.d.ts
uncached-route.mjs
usage-spike-triage.mjs
grade-recommendation.mjs
impact-label.mjs
impact-magnitude.mjs
investigation-brief.mjs
observation-safety.mjs
project-facts.mjs
queries.mjs
reconcile-candidates.mjs
render-report.mjs
repo-root.mjs
route-normalize.mjs
sanitizers/
bot-protection-certainty.mjs
cache-tag-invalidation-certainty.mjs
count-correct.mjs
function-duration-invocations.mjs
index.mjs
middleware-conflict.mjs
missing-citation.mjs
pre-release.mjs
rate-limit.mjs
rendering-mode-mislabel.mjs
undeclared-dep.mjs
vercel-directive-strip.mjs
window-units.mjs
scanners/
cache-components-suspense-dedupe.mjs
edge-heavy-import.mjs
force-dynamic.mjs
headers-in-page.mjs
index.mjs
large-static-asset.mjs
max-age-without-s-maxage.mjs
middleware-broad-matcher.mjs
missing-cache-headers.mjs
prisma-include-tree.mjs
region-pin-in-config.mjs
source-maps-production.mjs
sveltekit-prerender-missing.mjs
turbo-force-bypass.mjs
unoptimized-image.mjs
use-cache-date-stamp.mjs
support-topics.mjs
throttle.mjs
util.mjs
vercel.mjs
verify-claim.mjs
workspace-resolver.mjs
metadata.json
README.md
references/
candidates.md
data-collection.md
docs-library.json
doctrine.md
observability-plus.md
playbooks/
ai-application.md
api-service.md
content-site.md
ecommerce.md
... 75 moreThe FLOW.md
Read what you run.
This file reads your intent and auto-invokes the right skill at the right moment. You just prompt.
flow.vercel-nextjs-flow.FLOW.md
# FLOW.md: Next.js Production Quality > Take a Next.js UI task from first keystroke to a fast, accessible, deployed page, firing the right Vercel skill at each phase. > Skills vendored from Vercel (MIT). See ATTRIBUTION.md. Routing by Flowy. ## Phases 1. **Build**. Entry: writing or refactoring React/Next.js UI. Gate: code follows the performance and composition rules (named rule files cited). 2. **Review**. Entry: a buildable UI surface exists. Gate: Web Interface Guidelines findings list produced (file:line) and addressed. 3. **Optimize**. Entry: about to call the work done. Gate: signals.json collected and a ranked, metric-backed recommendation report exists. 4. **Deploy**. Entry: optimize gate passed and a ship is requested. Gate: a live Vercel URL is returned. ## Routing ``` USER MESSAGE │ ├─ INTAKE: first read the task, classify intent, pick the phase below ────────── │ │ │ ├─ new request mixes goals? -> split into build / review / optimize / deploy, route each │ └─ unsure which phase? -> ask one clarifying question, do not guess │ ├─ BUILD: writing, generating, or refactoring React/Next.js code ─────────────── │ │ │ ├─ component / page / data-fetch / bundle / re-render work? │ │ -> invoke react-best-practices │ │ Gate: changed code cites the rule files it satisfies (e.g. async-parallel, bundle-barrel-imports). │ └─ boolean-prop sprawl, compound components, or reusable API design? │ -> invoke composition-patterns │ Gate: components compose via children/context, not boolean modes (rule file named). │ ├─ REVIEW: a buildable UI surface exists, check design + accessibility ────────── │ │ │ └─ audit UI, UX, or accessibility before shipping? │ -> invoke web-design-guidelines │ Gate: a file:line findings list against the Web Interface Guidelines, each item resolved or waived. │ ├─ DONE-CHECK: about to claim the UI is done / ready to ship ──────────────────── │ │ │ └─ verify performance + cost before declaring complete? │ -> invoke vercel-optimize │ Gate: signals.json exists and a ranked recommendation report (Core Web Vitals + cost) is produced. │ ├─ DEPLOY: optimize gate passed and a ship is requested ───────────────────────── │ │ │ ├─ ship a preview or push live? │ │ -> invoke deploy-to-vercel │ │ Gate: a live Vercel URL is returned (preview by default, production only if asked). │ └─ deploy needs token-based / non-interactive auth? -> note it, deploy-to-vercel still owns the ship. Gate: live URL returned. │ ├─ ADVISE-ONLY: user is asking a question, not requesting work ────────────────── │ └─ answer from the relevant skill's rules; do not edit files. Gate: none (no artifact produced). │ ├─ SCOPE CHANGE: the brief changed mid-flow ───────────────────────────────────── │ └─ re-enter the earliest affected phase; prior downstream gates are void until re-passed. │ ├─ BLOCKED: waiting on an external dependency (token, deploy access, review sign-off) │ └─ park the task, record the resume trigger, surface the blocker; do not fake the gate. │ ├─ REVIEW-LOOP: review or optimize feedback came back ─────────────────────────── │ └─ re-verify the failing gate only, then re-run its skill; do not skip ahead. │ └─ DEFAULT: nothing above fits ───────────────────────────────────────────────── └─ Routing: none. State why no branch matched and ask for the missing detail. ``` ## Priority on collision 1. Blocked (a parked dependency wins over any forward motion). 2. Scope changed (re-enter the earliest affected phase before continuing). 3. Done-check (verify before any claim of complete or deploy). 4. Lifecycle order (build, then review, then optimize, then deploy). 5. Advisory (answer-only beats picking a work branch when the user only asked). 6. Default (no match). ## You are rationalizing if you think… - "It is a small component, the perf rules are overkill." A render waterfall or a barrel import is a small component's most common bug. Invoke `react-best-practices` and name the rule. - "The design looks fine, skip the a11y review." Looks-fine is not keyboard-navigable or contrast-checked. Run `web-design-guidelines` and produce the file:line list before shipping. - "I will eyeball performance, no need to collect metrics." `vercel-optimize` is observability-first: without signals.json you are guessing, and guesses are what blew the bill. Collect first. - "Just deploy to production to test it." Default is a preview deploy. Production only on explicit request; ship preview, get the URL, then verify. ## Additional skills (also available) The full upstream set is vendored in this Flow. The routing above sequences the core lifecycle; these additional skills are available and fire when their trigger matches. See ATTRIBUTION.md for the complete list and license. ### general - `react-native-skills` - `react-view-transitions`: Guide for implementing smooth, native-feeling animations using React's View Transition API (`<ViewTransition>` component, `addTransitionType`, and CSS view transition pseudo-elements). Use this skill whenever the user wants to add page transitions, animate route changes, create shared element animations, animate enter/exit of components, animate list reorder, implement directional (forward/back) navigation animations, or integrate view transitions in Next.js. Also use when the user mentions view transitions, `startViewTransition`, `ViewTransition`, transition types, or asks about animating between UI states in React without third-party animation libraries. - `vercel-cli-with-tokens`: Deploy and manage projects on Vercel using token-based authentication. Use when working with Vercel CLI using access tokens rather than interactive login, e.g. "deploy to vercel", "set up vercel", "add environment variables to vercel". - `writing-guidelines`: 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". ## Attribution - `react-best-practices` by **Vercel** (https://github.com/vercel-labs/agent-skills), MIT. - `composition-patterns` by **Vercel** (https://github.com/vercel-labs/agent-skills), MIT. - `web-design-guidelines` by **Vercel** (https://github.com/vercel-labs/agent-skills), MIT. - `vercel-optimize` by **Vercel** (https://github.com/vercel-labs/agent-skills), MIT. - `deploy-to-vercel` by **Vercel** (https://github.com/vercel-labs/agent-skills), MIT.
FAQ
vercel-labs-agent-skills is a Claude Code plugin of 9 hand-picked skills with a FLOW.md router. Install it once and the right skill fires as you prompt, with no slash command to remember. It is built for development work. It includes composition-patterns, deploy-to-vercel, react-best-practices. Free and open source.
- What is vercel-labs-agent-skills?
- A collection of skills for AI coding agents. Skills are packaged instructions and scripts that extend agent capabilities. Skills follow the Agent Skills format.
- How do I install vercel-labs-agent-skills?
- Run these in Claude Code: /plugin install flowy@flowy-flows then /flowy:vercel-nextjs-flow. Then prompt normally.
- Does vercel-labs-agent-skills auto-invoke its skills?
- Yes. It ships a FLOW.md router that Flowy's hook fires, so the matching skill runs as you prompt. You never name a skill.
- Is vercel-labs-agent-skills free?
- Yes. Flowy is free and open source, with nothing gated. You can read every skill in full before you install.