This demo shows interactive animated SVG filter effects.

The animation is made by animating a displacement map image, with a radial gradient mask to smoothly fade out the edges. To be able to run the animation the browser must support SVG filters, declarative animation (SMIL) and scripting.

See attributions.

Running the demo

Click on the "Start SVG Demo" at the top of this page.

Then click anywhere on the image to start animating a droplet ripple effect from that point.