SVG Blob Generator
有機的な流体シェイプをランダム生成
パラメータ調整
6 pts
Lv.6
#8a3ffc
SVG Blob Generatorの使い方
ランダムで有機的な形状（Blob）を作成し、SVGとしてダウンロードします。
1
形状の調整
「複雑さ（点の数）」と「コントラスト（歪み具合）」をスライダーで変更し、好みの形を探します。「再生成」ボタンで別のパターンを試せます。
2
色の変更
カラーピッカーで好みの色を選択します。
3
利用
SVGコードをコピーしてHTMLに貼り付けるか、SVGファイルとしてダウンロードしてデザインツールで使用します。
実際の使用例
シンプルなBlob
Complexity: 5, Contrast: 3
INPUT
Parameters
OUTPUT
滑らかな丸みを帯びた形状
よくある質問
商用利用は可能ですか？
はい、生成されたBlobは著作権フリーで、商用・個人を問わず自由にご利用いただけます。
背景画像として使うには？
ダウンロードしたSVGをCSSのbackground-imageに設定するか、HTML内に直接インラインSVGとして配置し、z-indexで背面に配置するのが一般的です。
役立つTips
デザインのアクセントに
単調になりがちなWebデザインの背景に、薄い色のBlobを配置すると、モダンで柔らかい印象を与えることができます。
画像のマスクとして
CSSのclip-pathプロパティやSVGのmask要素と組み合わせることで、写真を有機的な形に切り抜くことができます。