Glass Card
A frosted glass surface with a mouse-following glow effect. Move your cursor over the card to see it in action.
Installation
Usage
import { GlassCard } from "@/components/pioneerui/glass-card"
export default function Page() {
return (
<div className="bg-gradient-to-br from-violet-950 to-zinc-950 p-8">
<GlassCard tint="rgba(139,92,246,0.4)">
<h3 className="text-white font-bold">Feature Title</h3>
<p className="text-white/60 text-sm mt-1">Your content here.</p>
</GlassCard>
</div>
)
}Props
| Prop | Type | Default | Description |
|---|---|---|---|
glowFollow | boolean | true | Enable mouse-tracking glow orb |
tint | string | "rgba(139,92,246,0.3)" | Glow and shimmer border color |
children | ReactNode | — | Card content |