Spotlight Card
A radial gradient that follows the mouse cursor as it moves across the card.
Introduction
A radial gradient that follows the mouse cursor as it moves across the card.
Spotlight Card -- Basic
AHs Lab
The React Framework for the Web
Used by some of the world's largest companies, Next.js enables you to create high-quality web applications with the power of React components.
npx shadcn@latest add https://ahs-lab.vercel.app/r/SpotlightCard.jsonSpotlight Card -- Border Glow
AHs Lab
Production-ready animations
A simple yet powerful motion library for React that brings your components to life with smooth animations.
npx shadcn@latest add https://ahs-lab.vercel.app/r/SpotlightCardBorderGlow.jsonSpotlight Card -- Animated Border
AHs Lab
Build and deploy in seconds
Vercel is the platform for frontend developers, providing the speed and reliability innovators need to create at the moment of inspiration.
npx shadcn@latest add https://ahs-lab.vercel.app/r/SpotlightCardAnimatedBorder.jsonHover Depth Card
A 3D hover-enabled card with perspective transform, depth motion, and dark mode support. Perfect for showcasing avatars, product previews, or feature highlights with interactive flair.
Commands
Copy-ready CLI command blocks for React documentation. Display install commands with one-click copy, or switch between npm, pnpm, yarn, and bun with tabbed package-manager UI.