7 Kinds of cool HTML5 svg liquid droplet fusion decomposition animation effect

This is a set of cool liquid droplet fusion decomposition animation effects created using the HTML5 SVG filter. These SVG animation effects make some HTML elements. Transitions such as menus, paging buttons, apps, selection boxes, and so on, are fused and decomposed like a few drops of water. The effect is very cool.

The SVG filters can change a given graph to create the results we need. SVG includes a set of filter elements that can run various operations.
The most common SVG filter effect is to make the blur effect through Fegaussianblur .

<svg xmlns= "Http://www.w3.org/2000/svg" version= "1.1" width= "" "height=" >  <defs>    < Filter id= "blur" x= "0" y= "0" >      <fegaussianblur in= "sourcegraphic" stddeviation= "5"/>    </filter >  </defs>  <rect x= "y=" width= "height=" fill= "#8d81ac" filter= "url (#blur)"/>  

Online Demo: http://www.htmleaf.com/Demo/201503111501.html

: http://www.htmleaf.com/html5/SVG/201503111500.html

7 Kinds of cool HTML5 svg liquid droplet fusion decomposition animation effect