Background With Shooting Stars
An animated background with shooting star trails and pulsing concentric circles. Uses SVG animations for the stars and Framer Motion for the breathing circle effect.
Shooting stars spawn randomly from any edge of the viewport, traveling at configurable speeds with gradient trails. The SVG-based animation uses requestAnimationFrame for smooth 60fps performance. Each star scales up as it travels, creating a perspective effect. You can customize star and trail colors, speed ranges, and spawn delays through props.
Three concentric circles pulse gently in the background using staggered Framer Motion animations. Each circle scales between 1 and 1.05 with a 2-second delay between pulses. The circles use gradient backgrounds that adapt to light and dark modes.
Good fit for SaaS landing pages, developer tools, AI product sites, and tech startup homepages where you want subtle motion without distraction.
More from Backgrounds
Included with All-Access
One payment unlocks the code for this block and every other block, template and page.
Get All-AccessExplore more
About this block
Shooting stars spawn randomly from any edge of the viewport, traveling at configurable speeds with gradient trails. The SVG-based animation uses requestAnimationFrame for smooth 60fps performance. Each star scales up as it travels, creating a perspective effect. You can customize star and trail colors, speed ranges, and spawn delays through props.
Three concentric circles pulse gently in the background using staggered Framer Motion animations. Each circle scales between 1 and 1.05 with a 2-second delay between pulses. The circles use gradient backgrounds that adapt to light and dark modes.
Good fit for SaaS landing pages, developer tools, AI product sites, and tech startup homepages where you want subtle motion without distraction.