みなさんこんにちは！おさかなです！
今回は「SVG backgrounds」について、書いていこうと思います！
それでは、レッツゴー！！！！！
・SVG形式の画像を使いたい方
・高画質な「背景画像」を使いたい方
・WebデザインやCSSを勉強している方
高画質な「背景画像」がほしい～！
フルスクリーンでも綺麗に表示される「背景画像」ってないかな…？
あるよ。
おおっ！？
「SVG backgrounds」って何？
「SVG backgrounds」とは、SVG形式の画像を無料でダウンロードできるサイトのことです。
すべてのブラウザでサポートされており、CSSで使える16進数のカラーコードを表示してくれたり、色や透明度などカスタマイズができたりします！(いいね！)
実際につかってみよう！
それでは早速サイトにアクセスします！
「TRY ME」と矢印のある、◯をクリックすると…？
こんな感じで、サイトの背景画像が「黄色」のものに変わってしまいました！(魔法みたい～🌟)
カスタマイズしてみよう！
左側にカラーの詳細が表示されます！
一番上が「色の名前」By～は「製作者」が表示されていますね。(ふむふむ…。)
この色は”Liquid Cheese”って名前だったんだ！
「Customize」というブロックから、お好みのカラーにカスタマイズすることができます！
「COLOR」… 色
「BLEND」… ブレンド
「OPACITY」… 透明度
「HIDE UI」を押すと、画像の全体を見ることができます！(ほうほう…。)
こんな感じ…！(おおおお～っ✨)
画像の使用準備！
カスタマイズが完了したら画像の使用準備をしていきましょう！
使用方法は「CSSコード」を利用するか「SVG形式の画像」を保存するかの、2パターンあるので、ご自身の使いやすい方でOKです。
「CSSコード」を使用する場合
コードを使用する場合は「CSS Output」という項目の下にあるものをコピーすればOKです！
「SVG形式の画像」を使用する場合
SVG形式の画像を保存する場合は「DOWNLOAD SVG」というボタンをクリックして、画像を保存しましょう！
画像使用の「注意点」！
個人や商用で画像を使用する場合は、「無料のクレジット表記(FREE W/ATRIBUTION) 」または「有料ライセンスの取得(BUY LICENSE) 」を行う必要があります！
クレジット表記をする場合は、ページ下にあるCSSコードを貼り付ければOKです！
BUY LICENSE
有料ライセンスを購入すれば、更に多くのデザインを利用することができます！(おお！)
(あと、もうちょっと…🍊)
他にもたくさんのデザインが！
それでは最後に、いくつかのデザインを紹介して終わりにしたいと思います！
みなさんの作品が、更に良いものになりますように…🌟
(立体感があってすごい…！)
(大人っぽいシマシマ！)
(高級感あふれる赤と黒！かっこいい…✨)
(なんか、PCの基盤みたいだな…？！笑)
(まるまる！かわいい！)
(アイスクリーム屋さんみたいな、ストライプ！)
これで全ての操作は完了です。(やった～！)
お疲れ様でした☕
ここまで読んでくださり、ありがとうございました！
