SVG サンプル: ぼかしフィルタ

<feGaussianBlur> を使用したぼかしフィルタです。

Hello

トランジション

下記は hover 時にぼかしを外すトランジションを追加したものです。
(同じ要素を2つ (ぼかしあり、なし) 置いておき、hover で ぼかしありのほうを opacity: 0 にします)

Hello Hello

HTML

Chrome や Firefox の場合、SVGで定義したフィルタはHTML側の要素にも filter: url() で適用できます。

Hello