Shadcn.io is not affiliated with official shadcn/ui
React Light Waves Background
Soft ambient light waves with flowing gradients—subtle enough to be a true background that doesn't fight with content
These light waves are designed to be unobtrusive. Soft colored gradients flow gently across the screen, layered with transparency so they create depth without being distracting. There are ambient glow spots that drift slowly, and wave shapes that flow across the bottom third. The whole thing feels ethereal and calming. I reach for this when I need something more interesting than a solid color but don't want to compete with the content on top. The intensity prop lets you dial it way down if needed.
React Light Waves Background preview
Installation
Related Components
Aurora Background
CSS aurora gradient
Background Beams
SVG animated beams
Background Gradient
Flowing gradient blobs
Gradient Animation
Psychedelic gradient mesh
Wavy
Noise-driven wave lines
Ripple
Expanding circle waves
FAQ
Was this page helpful?
Sign in to leave feedback.