Background Beams
Light beams flowing along curved paths behind content.
- 1.1 KB gzipped
- Deps: motion/react
- Reduced-motion safe
- Base UI & Radix compatible
Preview
Now in public beta
Deploy on every push
Preview links for each branch, ready before the review starts.
Installation
pnpm dlx shadcn@latest add https://paulkeys.org/r/background-beams.jsonAdds components/velora/background-beams.tsx, installs motion and merges the keyframes and tokens into your CSS.
Props
| Prop | Type | Default |
|---|---|---|
className | string | — |
countNumber of beams | number | 7 |
Accessibility
- Reduced motion
- Only the faint static base curves render; the coloured beams and their gradient animations are not mounted.
- Keyboard
- Decorative — nothing to operate.
- Screen readers
- Decorative; the wrapper is aria-hidden.