BackgroundsCanvasBubbles

Bubble Swarm

Floating iridescent bubbles that drift, wrap, and flee from the cursor.

Customize

Tune bubble density, size, color drift, and cursor repulsion.

BackgroundCount35Background fade0.2Flee radius100Flee force1.8Min radius6Max radius24Hue speed0.2

Effect guide

Copy the bubble swarm animated background effect

What it is: Floating iridescent bubbles that drift, wrap, and flee from the cursor.

Where to use it: Use this motion pattern for hero sections, product pages, dashboards, and interactive marketing surfaces.

Supported formats: React, Vue, Vanilla JS.

Motion drops

Get motion drops

New UI effects, code snippets, and GrabMotion updates by email.

Company

Email