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

CSS Daire Oluşturucu - %50 Kenar Yarıçapı

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, dört köşenin tamamı bağlantılı ve %50'ye ayarlanmış şekilde kenarlık yarıçapı oluşturucuyu açar; bu değer, yalnızca CSS kullanarak bir kutuyu daireye dönüştüren değerdir. Dürüst olmak gerekirse: kare bir kutuda bu mükemmel bir daire oluşturur, ancak dikdörtgen bir kutuda aynı %50, bunun yerine stadyum benzeri bir elips üretir, çünkü her köşe yalnızca kendi çeyreğini tamamlar.

Bu ayrım önemlidir çünkü %50 kenar yarıçapı, CSS'de dairesel avatarlar, simge rozetleri ve durum noktaları oluşturmanın en yaygın yoludur; bir maskeyle bir daireyi kırpmaktan veya SVG'de bir daire çizmekten çok daha basittir ve sabit bir piksel yarıçapı değil, göreceli bir yüzde olduğundan her boyutta net kalır.

Mükemmel daireyi kilitlemek için kutuyu kendi CSS'nizde sabit bir kare boyutuna değiştirin veya hap benzeri bir şekil elde etmek için bilerek dikdörtgen bırakın - her iki durumda da köşeler burada bağlantılı kalır, böylece tek bir kaydırıcı siz ortaya çıkan CSS'yi kopyalarken dördünün de senkronize olmasını sağlar.

🛡️
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.