S
SnapUtil
Design Tools

Blobシェイプジェネレーター

モダンウェブデザインのためのオーガニックなブロブ形状を生成

形状

5
50%
400px
0°

色

<svg viewBox="0 0 100 100" width="400" height="400" xmlns="http://www.w3.org/2000/svg">
  <path d="M 123.29826643403976,50 C 126.29551718845796,70.87647699278263 116.0720221029116,80.30314167381715 97.74745549440166,97.74745549440166 C 79.42288888589172,115.19176931498617 72.28123770202585,121.36974532751303 50.00000000000001,119.77725528233805 C 27.718762297974166,118.18476523716306 23.986983815882944,108.82180913428623 8.622504686298292,91.37749531370171 C -6.741974443286361,73.9331814931172 -11.715908957419753,70.43075521776971 -11.457916518338607,50.00000000000001 C -11.19992407925746,29.5692447822303 -5.710004686961771,26.467285499872524 9.654474442622877,9.654474442622892 C 25.018953572207526,-7.158336614626741 30.9740054914735,-18.398012499160593 49.999999999999986,-17.25124422899853 C 69.02599450852648,-16.104475958836467 67.4338858682189,-2.571263533978488 85.75845247672883,14.241547523271144 C 104.08301908523877,31.054358580520777 120.30101567962156,29.123523007217372 123.29826643403976,50 Z" fill="#6366f1" transform="rotate(0 50 50)" />
</svg>

なぜBlobシェイプジェネレーターを使うべきですか？

  • ✓100%無料 - 隠れた費用やプレミアム機能はありません
  • ✓登録不要 - アカウント作成なしですぐに使えます
  • ✓プライバシー重視 - すべての処理はブラウザで行われます。データはサーバーに送信されません
  • ✓超高速 - サーバー遅延なしで即座に結果を確認できます

使い方

  1. 上の入力エリアにテキストを入力または貼り付けてください
  2. ツールが自動的に入力を処理します
  3. 結果をコピーするかファイルとしてダウンロードしてください

機能

  • ✓Randomize blob shapes
  • ✓Complexity and contrast control
  • ✓Size adjustment
  • ✓Color and gradient fill
  • ✓SVG and CSS clip-path export
  • ✓Animation keyframes

よくある質問

How can I animate blob shapes?

Generate multiple blob keyframes and use CSS animations or JavaScript to transition between them.

関連ツール

波形SVGジェネレーターグラデーション生成パターンジェネレーター