WOW Effects

Spotlight

A spotlight effect that follows the mouse cursor, illuminating content underneath.

Move your mouse here

Installation

npx benflux-ui add spotlight

Usage

import { Spotlight } from "@/components/ui/spotlight"

<div className="relative overflow-hidden rounded-xl bg-zinc-950 h-96">
  <Spotlight fill="hsl(var(--primary))" />
  <div className="relative z-10 text-white p-8">
    <h1 className="text-4xl font-bold">Hello World</h1>
  </div>
</div>

Props

Prop	Type	Default
fill	string	"white"
size	number	200
opacity	number	0.15