Spotlight Card

A card with a mouse-following spotlight gradient effect.

Preview

Spotlight Effect

A subtle gradient that follows your mouse cursor, creating a beautiful spotlight effect that reveals borders and textures.

Customize

Installation & Usage

tsx
import { SpotlightCard } from "@/components/ui/spotlight-card"

export function SpotlightCardDemo() {
  return (
    <div className="flex justify-center p-10">
      <SpotlightCard spotlightColor="#b928e2" spotlightRadius={360} />
    </div>
  )
}