Back to components
Marketing component
Blurred Orb
Gradient-blurred backdrop element - drop behind a hero or section for a soft glow accent.
Install
$ Run in your project root
pnpm dlx shadcn@latest add https://vibekit.desishub.com/r/blurred-orb.jsonWhat it does
- Primary / accent / muted variants using shadcn tokens
- Configurable size via className
- Override gradient via style prop for custom radial-gradients
- Aria-hidden + pointer-events-none - purely decorative
When to use
Use it
Hero backdrops, behind feature cards, beside CTAs - anywhere a flat hero needs subtle depth.
Skip it
Information-dense interfaces where the blur would compete with content.