Interactive Background Card

Interactive hero backgrounds with cursor fields, layered waves, particle noise, and premium motion depth.

Interactive backgroundsbackgroundcursorcanvaswavesparticles

Interactive Dots

Interactive background

Build a hero that reacts to every move.

A responsive dot field with soft cursor repulsion, proximity lines, and physics-like return motion for polished SaaS and portfolio heroes.

Layered Wave Background

Layered wave background

A calmer hero for launches that need atmosphere.

Gradient wave layers drift at different speeds to create soft depth behind landing pages, SaaS heroes, portfolio intros, and event banners.

Particle Noise

Particle noise

Terrain-like particles flowing through a noise field.

A regular dot grid displaced by smooth noise into soft wave ridges, tuned for dark Framer-like generative hero sections.

Aurora Wavy Lines

WebGL motion

Aurora lines for immersive sections

Animated shader waves with a cooler emerald palette and smooth flowing depth.

Variants

Interactive DotsLayered Wave BackgroundParticle NoiseAurora Wavy Lines

Pro block

Upgrade to Pro to access the full source code for this block.