Desain / SVG

Generator Blob SVG (Bentuk Organik Acak)

Buat bentuk blob acak yang halus untuk latar belakang dan ilustrasi: pilih jumlah titik dan tingkat keacakannya, tentukan warna atau gradien dua warna, lalu download atau salin SVG.

Generator Blob SVG (Bentuk Organik Acak): Titik-titik ditempatkan secara merata di sekeliling lingkaran, lalu masing-masing ditarik ke arah tengah dengan jarak acak dan dihubungkan menjadi kurva tertutup yang halus. Jumlah titik sedikit dan keacakan tinggi menghasilkan bentuk bergelombang; jumlah titik banyak dan keacakan rendah menghasilkan bentuk yang lembut dan hampir bulat. Berjalan 100% lokal di browser Anda tanpa upload file ke server.

Kategori
Tools developer
Dijalankan
Di browser Anda
Biaya
Gratis · tanpa daftar
Ketersediaan
Siap digunakan
Generator blob SVGPemrosesan lokal

Berjalan sepenuhnya di browser Anda

SVG

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 400 400" width="400" height="400"><path d="M359.5,200 C360.7,243.5 315.4,319 278.8,336.4 C242.1,353.9 174.7,327.5 139.5,304.7 C104.4,282 69.5,237.5 68,200 C66.4,162.5 96.4,100.3 130.4,79.5 C164.4,58.7 233.7,55.4 271.9,75.5 C310.1,95.6 358.4,156.5 359.5,200 Z" fill="#63c42d"/></svg>

Titik ditempatkan secara merata di sekeliling lingkaran, lalu masing-masing ditarik ke arah tengah dengan jarak acak dan dihubungkan oleh kurva tertutup yang halus. Lebih sedikit titik dan lebih banyak keacakan menghasilkan bentuk yang lebih bergelombang; keacakan 0% menghasilkan lingkaran. Blob membuat latar belakang yang lembut di belakang foto, ikon, dan heading.

Kegunaan

Blob cocok untuk membuat latar lembut di belakang foto produk, ikon, avatar, dan judul. Di belakang teks, gunakan warna pucat atau fill dengan opacity rendah agar kontras teks tetap terjaga; untuk melihat blob di balik kaca buram, padukan dengan generator glassmorphism.

Pengeditan

Output-nya berupa satu path dengan kurva Bézier kubik, sehingga dapat dibuka di editor vektor apa pun. Untuk mengubah beberapa titik secara manual, tempelkan ke editor SVG.

Cara menggunakannya

  1. Pilih jumlah titik dan tingkat keacakannya.
  2. Pilih warna atau gradien.
  3. Klik untuk membuat blob baru sampai menemukan bentuk yang disukai, lalu download atau salin SVG.

Privasi & batasan

Bentuk dibuat di browser Anda.

Alat terkait

Gelombang SVGEditor SVGGlassmorphism

Pertanyaan umum

Bagaimana cara menempatkan foto di dalam blob?

Salin path dan gunakan di dalam SVG clipPath, atau simpan blob lalu gunakan sebagai CSS mask-image di atas foto.

Bisakah saya menganimasikan blob?

Ya: buat dua blob dengan jumlah titik yang sama, lalu animasikan atribut d pada path di antara keduanya; jumlah titik yang sama membuat perubahan bentuk lebih halus.

Apakah ada batas ukuran?

SVG berukuran 400 × 400, tetapi dapat diskalakan ke ukuran apa pun tanpa kehilangan ketajaman.

Alat gratis · berjalan di browser anda · tanpa perlu akun