WEB業界で働く人や興味がある人に役立つ情報サイト“qam(カム)”

K.K.

2019/05/29

サイトを華やかに!SVG背景パターンジェネレーター「SVG Backgrounds」

投稿者: K.K.
カテゴリー: デザイン >デザイン参考

今回はSVGで背景パターンを生成してくれるオンラインツール「SVG Backgrounds」をご紹介します。

使い方

まずはサイトにアクセスしてみましょう。
https://www.svgbackgrounds.com/

アクセスしてみると、円形のオブジェクトが表示されます。試しにクリックしてみると…

背景が選択したデザインに反映されました!

左側にあるパネルの項目で微調整も可能なので、こちらを使って好きなデザインに変更することも出来ます。

修正が終わったら「CSS Output」からコードをコピーするか、「DOWNLOAD SVG」から直接ダウンロードをして自分のサイトの反映させたいCSSに記述します。

注意点

こちらのSVGを使用する際には、ライセンスをリンク表示もしくはCSS内にコメントアウトで表示する必要があるので、下記URLをご確認ください。ライセンスは「CC BY 4.0」になります。

ライセンス情報
https://www.svgbackgrounds.com/license/

まとめ

背景に色味や模様があることによってサイト全体の見栄えが様変わりします。デザインでお困りの方はぜひ活用してみてはいかがでしょうか。

最後までお読みいただき、ありがとうございました。
よろしければシェアしていただければ幸いです。

  • このエントリーをはてなブックマークに追加

関連記事

よろしければこちらの記事もお読みください。

WEB業界ならqam!qam(カム)はWEB業界で働く人や興味がある人に役立つ情報サイトです。
マーケティングやデザイン、マークアップ(コーディング)、プログラム、トレンドなどの情報をqamライター陣が執筆。噛めば噛むほど(読めば読むほど)制作・開発や運営・運用、業界知識やノウハウを学ぶことができます。

トップへ