Spotlight Card
A card with a spotlight effect that follows the mouse cursor.
npx arupui add spotlight-card
Preview
Feature One
Hover to see the spotlight effect.
Feature Two
Custom spotlight color.
Usage
spotlight-card.tsx
import { SpotlightCard } from "@/components/blocks/spotlight-card"
<SpotlightCard>
<h3>Feature</h3>
<p>Description</p>
</SpotlightCard>Props
| Prop | Type | Default |
|---|---|---|
spotlightSize | number | 350 |
spotlightColor | string | rgba(120, 119, 198, 0.15) |
spotlightSizeType:
numberDefault: 350spotlightColorType:
stringDefault: rgba(120, 119, 198, 0.15)