vercel-labs logo
#164 by installsFrontend & frameworksvercel-labs/agent-skills

vercel-react-view-transitions

Add smooth native animations between UI states using React's View Transition API

Installs
168K
all time
This week
9.8K
installs
Repo stars
31.9K
GitHub
First seen
Mar 31, 2026
on skills.sh
Install
npx skills add https://github.com/vercel-labs/agent-skills --skill vercel-react-view-transitions
Works with Claude Code, Cursor, Codex, GitHub Copilot, Windsurf, Gemini CLI and other agents that read SKILL.md.
What it does

Implements the browser's native document.startViewTransition for performant, GPU-accelerated animations between pages, routes, and component states in React and Next.js. Reach for this when you need page transitions, route changes, shared element animations, or list reorders without third-party libraries. Gracefully degrades in unsupported browsers.

  • Animate route changes and page transitions with directional (forward/back) awareness
  • Create shared element animations that communicate spatial continuity across state changes
  • Handle component enter/exit, list reordering, and data loading reveals with CSS view-transition pseudo-elements
  • Declarative <ViewTransition> component with built-in priority patterns (shared elements → suspense → list identity → state change → routes)