Gooey effect
A blur-plus-contrast trick that makes nearby shapes stretch and fuse like drops of thick liquid.
See it
What it is
The gooey effect makes nearby shapes stretch, bridge, and fuse like drops of thick liquid. The common 2D recipe blurs the shapes together, then raises the alpha contrast until the soft overlap snaps back into a crisp shared silhouette.
Lucas Bebber's CSS-Tricks article The Gooey Effect is the canonical web reference. Its SVG recipe pairs feGaussianBlur with an alpha-boosting feColorMatrix for playful loaders, blob menus, cursor trails, and transitions.
Gotcha: the contrast step also eats thin details and can clip soft edges. Keep shapes inside a padded filter region, and tune blur radius and alpha threshold together so the blobs join without swelling.
Ask AI for it
Build a gooey blob effect with one SVG filter: apply feGaussianBlur to SourceGraphic at about 10px, then use feColorMatrix to multiply alpha and subtract a threshold until overlapping circles fuse into a crisp bridge. Pad the filter bounds so moving blobs are not clipped.