Glow Card
Card with cursor-tracked radial spotlight glow. Configurable color, size, and opacity.
Installation
1
Run the CLI
$npx particleui-cli add glow-card
Usage
TSX
import { GlowCard } from "@/components/ui/glow-card"
export default function Example() {
return (
<GlowCard className="p-6">
<h3 className="font-semibold">Card title</h3>
<p className="text-sm text-text-3 mt-1">Move your cursor over the card.</p>
</GlowCard>
)
}Props
| Prop | Type | Default | Required |
|---|---|---|---|
| glowColor | string | "oklch(78% 0.17 200)" | no |
| glowSize | number | 300 | no |
| glowOpacity | number | 0.15 | no |
Details
Source filecomponents/ui/glow-card.tsx
Typeui
Categoriescards, particles
npm dependencies
Registry deps
Claude skill—