⭐ 0
🔍
Metin Görsel PDF ve Belgeler Ses Müzik Elektronik Zaman Faydalı Araçlar Doğrulayıcılar Ezoterizm Oyunlar

Organik CSS Blob Şekil Oluşturucu

CSS kenarlık yarıçapını görsel olarak tasarlayın: piksel veya yüzde cinsinden dört bağımsız köşe kaydırıcısı, anlık daireler ve haplar için tüm köşeleri birbirine bağlayan bir kısayol, ayrıca rastgele şekillere sahip bir organik blob modu.

12px
12px
12px
12px
İşleniyor... 0%

Sonuç

Bu sayfa, kenarlık yarıçapı oluşturucuyu, önceden yüklenmiş organik bir şekille doğrudan blob modunda açar: kare köşeler yok, mükemmel daire yok, yalnızca CSS'den oluşturulmuş yumuşak, düzensiz bir taslak. Yeni bir varyasyon için istediğiniz zaman Rastgeleleştir'e basın.

Her CSS blobunun ardındaki hile, sekiz değerli eğik çizgi sözdizimidir: border-radius, eğik çizgiyle ayrılmış dört yüzdelik iki kümeyi kabul eder; ilk küme yatay yarıçapları büker ve ikincisi dikey olanları eğirir. İki kümenin uyumsuzluğu tam olarak düz yuvarlatılmış bir dikdörtgenin simetrisini organik bir çerçeveye bölen şeydir.

Bunun gibi lekeler, sayısız modern açılış sayfasındaki kahraman resimlerinin, avatarların ve illüstrasyonların arkasındaki boş alanı doldurur; çünkü hiçbir kitaplığa veya SVG dışa aktarımına gerek yoktur; bu, CSS'nin dört satırıdır. Geçerli şekli kopyalayın veya düzeniniz için doğru olanı bulana kadar rastgele seçim yapmaya devam edin.

🛡️
Tarayıcıda Çalıştırıldı

Dosyalarınız ve girdileriniz bu cihazdan asla ayrılmaz. İşlem tamamen çevrimdışı çalışır. %100 Güvenli.

Kabul Edilen Formatlar ve Kurallar

  • Köşe modu: her biri piksel ve yüzde birimleri arasında değiştirilebilen bağımsız sol üst, sağ üst, sağ alt ve sol alt yarıçap kaydırıcıları.
  • Her köşeyi tek bir kaydırıcıdan yönlendiren Tüm köşeleri birbirine bağla onay kutusu ve ayrıca kırpılmış köşelerin görünür kalması için açık veya koyu bir arka planda dama tahtası önizlemesi.
  • Organik sekiz değerli eğik çizgi sözdizimi şekilleri oluşturan, büyük gösterilen ve CSS olarak kopyalamaya hazır olan Rastgeleleştir düğmesine sahip Blob modu.

Temel Faydalar

✓ Her kaydırıcı canlı önizlemeyi ve CSS satırını anında günceller, böylece 12px %40 8px %24'ün gerçekte neye benzediğini asla tahmin etmenize gerek kalmaz.
✓ Tüm köşeleri birbirine bağlama kısayolu, diğer üç köşeye elle dokunmadan bir kaydırıcıyı mükemmel bir daireye, hap veya sincap şekline dönüştürür.
✓ Blob modu, CSS'nin sekiz değerli eğik çizgi sözdizimiyle organik, rastgele şekiller oluşturur; tek bir kenarlık yarıçapı değerinin asla üretemeyeceği bir görünüm.

Kullanım Durumları

  • • Bir kartın dört köşe yarıçapını bağımsız olarak çevirin; açılır panelin yalnızca üst kısmını veya sekmenin yalnızca bir tarafını yuvarlayın.
  • • Mükemmel bir daire, stadyum şeklinde bir hap düğmesi veya iOS tarzı bir sincap oluşturmak için dört köşenin tümünü tek bir kaydırıcıya bağlayın.
  • • Blob moduna geçin ve organik bir şekil, bir kahraman görselinin veya avatarın arkasındaki boş alana sığıncaya kadar Rastgeleleştir'e basın, ardından CSS'yi kopyalayın.