HTML CSS examples for SVG:Filter
Create filter in SVG for body
<html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <style id="compiled-css" type="text/css"> body {<!-- ww w .ja v a 2 s . c o m--> filter: url('#goo') } .circle { position: absolute; width: 80px; height: 80px; background-color: #E63946; border-radius: 50%; } .circle-1 { left: 9%; } </style> </head> <body> <div class="circle circle-1"></div> <div class="circle circle-2"></div> <svg> <defs> <filter id="goo"> <fegaussianblur in="SourceGraphic" stdDeviation="5" result="gaussianBlur" /> <fecolormatrix in="gaussianBlur" type="matrix" values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 12 -6" result="color-matrix" /> <feblend in="SourceGraphic" in2="color-matrix" /> </filter> </defs> </svg> </body> </html>