SVG 虚化

虚化效果

<svg height="100" width="100" xmlns="http://www.w3.org/2000/svg">
  <defs>
    <filter id="f1" x="0" y="0" xmlns="http://www.w3.org/2000/svg">
      <feGaussianBlur in="SourceGraphic" stdDeviation="15" />
    </filter>
  </defs>
  <rect width="90" height="90" fill="yellow" filter="url(#f1)" />
</svg>

stdDeviation 值越高虚化程度越高

<svg height="100" width="100" xmlns="http://www.w3.org/2000/svg">
  <defs>
    <filter id="f2" x="0" y="0" xmlns="http://www.w3.org/2000/svg">
      <feGaussianBlur in="SourceGraphic" stdDeviation="55" />
    </filter>
  </defs>
  <rect width="90" height="90" fill="yellow" filter="url(#f2)" />
</svg>