SVGの背景パターンを手軽に作れるジェネレーター「SVG Backgrounds」

簡単にSVGの背景パターンを作成できる「SVG Backgrounds」の紹介です。
30種類のパターンから自分好みにカラー・スケール・透明度を調整しコードをコピペするだけで使用できます。

SVG Backgrounds

ベースとなるバックグラウンドパターンを選択し、左エリアのカスタマイズでカラーやスケールを調整します。パターンのスケールを変えるだけでも印象が大分変わりますし、要素の背景にワンポイントで使用することも出来そうです。

ライセンスはCC BY 4.0。 リンク表示もしくはCSS内コメントアウトでの表示が必要なようです。
詳細はライセンスページで確認して下さい。



PICK UP
RELATED POSTS
  • 【CSS】border (枠線) の使い方 -初心者向け-
  • 【JS】alertウィンドウのデザインを変更できる「SweetAlert」
  • 波の動きの背景を作成することができる「Wavie.js」
  • モーフィングアニメーションのページ遷移を実装できる「Morphing Page Transition」
  • パーツを組み合わせるだけで簡単にHTMLを生成できる「Stitches」
  • 動きのあるバブルを背景に設定することができる「bubbly-bg」
POPULAR POSTS
  • 長いURLを短くするオススメの短縮URLサービス
  • 無料で使えるおしゃれな英語の筆記体フリーフォントまとめ
  • 漢字が使えるおすすめの日本語フリーフォントまとめ
  • hulu (フールー)で観れるおすすめの海外ドラマ・国内ドラマ【2019年7月版】
  • CSSグラデーションの作成に役立つジェネレーター・Webサービスまとめ
RECENT POSTS
  • hulu (フールー)で観れるおすすめの海外ドラマ・国内ドラマ【2019年7月版】
  • プライス・値段表示などに使えそうな英数字フォント13選
  • 無料で使えるレトロ・ヴィンテージな雰囲気の英語フォントまとめ
  • Photoshopで簡単に背景を伸ばすテクニック
  • CSSで作成する吹き出しとデザインのアイデア