Velora UI

Aurora Background

Velora's signature drifting aurora gradient backdrop.

  • 0.6 KB gzipped
  • Zero dependencies
  • Reduced-motion safe
  • Base UI & Radix compatible
Open in v0

Preview

Spring release

Northern lights for your hero

A slow, drifting gradient that sits behind any headline.

Installation

pnpm dlx shadcn@latest add https://velora.colorlib.com/r/aurora-background.json

Adds components/velora/aurora-background.tsx and merges the keyframes and tokens into your CSS.

Props

PropTypeDefault
intensity

Overall opacity of the aurora blobs

"subtle" | "medium" | "vivid""medium"

Also accepts every <div> attribute, forwarded to the root element.

Accessibility

Reduced motion
The drift animation is off; the three blurred colour blobs rest at their default positions, so the glow is unchanged but static.
Keyboard
Decorative — nothing to operate.
Screen readers
Decorative; the wrapper is aria-hidden and ignored by assistive tech.