Sekiz tutamaç. Tek organik şekil. Yapıştırmaya hazır canlı CSS.
Bu ücretsiz fancy border-radius oluşturucu, sekiz değerli CSS border-radius söz dizimini elle tutulur, sekiz tutamaklı bir oyun alanına dönüştürür — herhangi bir tutamağı sürükleyin, şekil anında morf eder ve kopyalamaya hazır CSS hemen yanında güncellenir, tamamen tarayıcınızda çalışır.
Sekiz çevresel tutamağı sürükleyerek her köşe için yatay ve dikey yarıçapları bağımsızca ayarlayın. Önizleme canlı olarak morf eder ve üretilen border-radius bildirimi hemen yanında, stil dosyanıza kopyalanmaya hazır şekilde görünür.
Önizlemenin etrafına yerleştirilmiş sekiz tutamağın herhangi birini sürükleyerek her köşeyi şekillendirin; şekil ve CSS birlikte güncellenir. Bileşeninizi taklit etmek için genişlik, yükseklik ve rengi ayarlayın, ardından kod parçacığını almak için CSS Kopyala'ya veya işaretlemenize bırakabileceğiniz rastgele-değer sınıfı için Tailwind Kopyala'ya basın.
Kısayol, aynı sırayla dört yatay yarıçap (sol-üst, sağ-üst, sağ-alt, sol-alt) ve dört dikey yarıçapı eğik çizgiyle ayırarak ayarlar; her köşede eliptik bir eğri üretir — organik blob şekilleri tam olarak bu sayede mümkün olur.
Evet — yüzde birimleri kullandığınızda yarıçaplar elemanın kutusuyla akıcı şekilde ölçeklenir, böylece tek bir kural tüm kırılma noktalarında siluetini korur.
Kesinlikle. Sekiz değerli border-radius söz dizimi CSS Backgrounds and Borders Module Level 3'ün bir parçasıdır ve iOS Safari ile Android Chrome dahil her güncel tarayıcıda desteklenir.
Tooljar ekibi tarafından W3C CSS Backgrounds and Borders Module Level 3 spesifikasyonuna göre kurulmuştur; sekiz değerli yarıçaplar canlı render edilir, bu yüzden önizlemede gördüğünüz şey, tarayıcının üretilen bildirimden boyadığı tam olarak budur.