Wave Effect

What it does

A field of particles moving in wave patterns — dots rising and falling in formation, like a crowd doing a wave or a surface seen from above.

Where you would use it

With support for cursor interaction, color shifting, glow, and depth controls, Wave Animation is perfect for hero sections, product launches, portfolios, music websites, and experimental landing pages.

Controls

34 controls, 17 of which only appear when they are relevant.

Working through the panel

Style and Fine Tune

Style is the first control. Signature, dense field, calm flow and concentric are complete looks that own their wave settings, so those settings stay hidden.

Switch to Custom and four appear: the Wave type — ocean, radial, interference, vortex or noise — plus speed, frequency and amplitude.

Only Custom opens those. There's a separate Fine Tune toggle, and it opens different controls — Base Size, Base Spacing and a Legacy Shape switch, which are the underlying particle settings rather than the wave ones.

The particles

Density is how many particles fill the frame, as a multiplier. Pixel Size is how large each one is. Pixel Type is square, round, soft or diamond.

Soft is the one that changes the read most — it blurs each particle, which turns a field of dots into something closer to mist.

Opacity fades the whole field, which is the quickest way to sit it behind text without touching anything else.

Colour

Particles is the base colour, over a Background.

Gradient is off by default. Turn it on and a second colour appears, and the particles blend between the two across the field — which adds depth that a single colour can't.

And Shimmer, which is on, varies the brightness of individual particles as they move. It's the difference between a field that looks rendered and one that looks alive. Turning it off is a legitimate choice for a very calm background, but it's the first thing to try turning on if the effect feels flat.

Cursor, view and cost

Three more toggles open groups of their own.

Cursor Trail adds a trail under the pointer, with a radius, a strength and a length.

View Controls opens the camera: perspective, tilt, rotation, a vertical offset, and a depth fade. That's how you take the field off flat and into a tilted plane.

And three settings decide what it costs. Quality is auto, fast or high. Offscreen is on by default and stops the field rendering when it's scrolled out of view. And Reduce Motion, also on, gives a calmer version to visitors who've asked their system for one.

Leave those last two alone. They're doing real work.

Performance and limits

• It stops rendering when it scrolls out of view, so an instance below the fold costs nothing until the visitor reaches it.

• Visitors whose system asks for reduced motion get a calmer version automatically.

• Static rendering is handled, so canvas thumbnails and exports show a settled frame rather than a blank box.

• It renders with WebGL at whatever size and pixel density the frame needs — there is no image to download and no resolution to outgrow.