スマホの端末も高解像度になってきたものの、その解像度に合わせた画像を使おうとするとどうしても重くなってしまう・・・というシーンに、SVGはかなり使えますよね。
SVGenerationはそんなSVGを背景イメージとして使うときに便利なSVG背景素材集です。凄いのは、各SVGのカスタマイズができる点です。
使い方
サイトにアクセスするとこんな感じのSVG画像が並んでいます。
「Generate」ボタンをクリックすると、こんな画面が。スライドバーを操作すると、好みの感じにカスタマイズすることができます。
こんな感じに雰囲気を変えることができます。気に入ったら「Download SVG」ボタンをクリックしてダウンロードしましょう。
いちいちダウンロードするのが面倒な方は以下のCSSコードをコピペして使ってしまいましょう。data:imageなので、この文字列で背景画像が表現されている形になります。
SVG Filtersを使っている画像はAndroidブラウザ、IE9以下、Safari5以下では表示できないことに注意が必要です。
SVGの素材が増えてきて、良い時代になりました。容量も軽くなるし、表示も綺麗になるので、積極的にSVGを使っていきたいですね。
