SVG Blob Oluşturucu

SVG Blob Oluşturucu nedir?

SVG Blob Oluşturucu, arka planlar, hero bölümleri, avatarlar veya dekoratif vurgular için yumuşak, organik blob şekillerini elle çizmeden isteyen tasarımcılar ve ön uç geliştiriciler için ücretsiz, tarayıcı içi bir araçtır. İki değeri kontrol edersiniz: karmaşıklık (şeklin çevresindeki çapa noktalarının sayısı) ve kontrast (her noktanın kusursuz bir daireden ne kadar saptığı). Durumda tutulan ve Yeniden Oluştur düğmesiyle artırılan bir tohum, karmaşıklık ve kontrastı sabit tutarken sonsuz varyasyon arasında dolaşmanızı sağlar. Çıktı tek bir pürüzsüz, kapalı Bézier yolu olarak işlenir; böylece temiz SVG biçimlendirmesini kopyalayabilir, herhangi bir öğeyi maskelemek için bir CSS clip-path() kuralı alabilir veya kullanıma hazır bir .svg dosyası indirebilirsiniz. Markaya uygun süslemeleri hızlıca oluşturmak veya blob yollarının bir daire çevresindeki noktalardan nasıl kurulduğunu öğrenmek için kullanın.

SVG Blob Oluşturucu nasıl kullanılır

1. Ayarlar'ı açın ve şekil için karmaşıklığı (nokta sayısı, 3-16) belirleyin.
2. Kenarların ne kadar düzensiz ve dalgalı olacağını kontrol etmek için kontrastı (0-100) ayarlayın.
3. Renk çipiyle veya bir HEX değeri yazarak bir dolgu rengi seçin.
4. Şekli beğenene kadar bir sonraki tohumdan yeni bir rastgele varyasyon elde etmek için Yeniden Oluştur'a tıklayın.
5. SVG biçimlendirmesini veya CSS clip-path kuralını kopyalayın ya da bir .svg dosyası kaydetmek için İndir'e tıklayın.

Örnekler

Sıkça sorulan sorular

Karmaşıklık ve kontrast neyi kontrol eder?

Karmaşıklık, bir daire çevresine eşit aralıklarla yerleştirilen çapa noktalarının sayısıdır (3 ile 16 arası) — daha fazla nokta daha ayrıntılı bir ana hat oluşturur. Kontrast, her noktanın temel yarıçaptan içeri veya dışarı rastgele ne kadar itildiğidir (0 ile 100 arası); böylece 0 sade bir daireye yakındır ve 100 oldukça düzensizdir.

Yeniden Oluştur düğmesi nasıl çalışır?

Her blob, sayısal bir tohum ile karmaşıklığınız ve kontrastınızdan oluşturulur. Yeniden Oluştur tohumu bir artırır ve şekli yeniden hesaplar; böylece karmaşıklık, kontrast ve renk aynı kalırken her tıklamada yeni bir rastgele varyasyon elde edersiniz.

SVG ile clip-path çıktısı arasındaki fark nedir?

SVG çıktısı, gömebileceğiniz veya indirebileceğiniz eksiksiz, bağımsız bir <svg> dosyasıdır. clip-path çıktısı, path() kullanan tek bir CSS kuralıdır; herhangi bir HTML öğesine uygulayarak onu aynı blob ana hattına kırpabilirsiniz.

Rengi değiştirip dosyayı indirebilir miyim?

Evet. Dolgu rengini renk çipiyle veya bir HEX değeriyle belirleyin; önizleme, SVG ve indirme bunların hepsini kullanır. Tamamen tarayıcınızda üretilen bir blob.svg dosyasını kaydetmek için İndir'e tıklayın.

Şekillerim veya ayarlarım bir sunucuya gönderiliyor mu?

Hayır. Blob, yerel bir tohum tabanlı rastgele işlevle üretilir ve tüm SVG ve clip-path dizeleri tarayıcınızda oluşturulur. Hiçbir şey yüklenmez; bu nedenle araç çevrimdışı çalışır ve çalışmanız gizli kalır.