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

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

SVG Backgrounds

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

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



  • メニューのホバーエフェクト集「Inspiration for Menu Hover Effects」
  • バーガーメニューなどアニメーションで切り替わるボタンを生成できる「Transformicons」
  • 【CSS】text-shadowの使用例をまとめたサイト「Trendy CSS Text Shadows」
  • 【CSS】いろんなスタイルのボタンを簡単に実装できる「bttn.css」
  • 【Webデザイン】Webサイト制作に役立つブックマークレット
RELATED POSTS
  • 【jQuery】サイドバーをスライドで表示できるSimple Sidebar
  • 世界の国旗をCSSとdivのみで実装する「CSS Flags」
  • jQueryプラグインをまとめた検索サイト「jQuery Cards」
  • SVGで作成されたローディングアイコンセット「SVG Loaders」
  • 立体感のあるアニメーションホバーエフェクト「Stack Motion Hover Effects」
  • キレイな装飾のテキストアニメーション「Decorative Letter Animations」
RECENT POSTS
  • 【2021年版】 WordPressのおすすめテーマ17選(無料版/有料版)
  • 【2021年版】 無料で使えるフリー画像・写真素材サイト27選(国内/海外)
  • 【2021年版】 Google Fontsの使い方とおすすめ日本語フォント
  • 【2021年版】 無料で使えるフリー動画素材サイト10選
POPULAR POSTS
  • プライス・値段表示などに使えそうな英数字フォント13選
  • 【2021年版】 無料で使えるフリー動画素材サイト10選
  • PhotoShopで新聞の写真風ドットスタイルに画像を加工する
  • コピペするだけで使えるCSSボタンジェネレーターまとめ
  • Youtubeの埋め込み動画をレスポンシブに対応させる方法