Penjana Border Radius

Deklarasi border-radius boleh mengambil sehingga empat nilai penjuru bebas serta sintaks lapan-nilai-sengkang pilihan untuk lengkung organik — lebih banyak bahagian bergerak daripada yang disedari kebanyakan orang sehingga mereka memerlukan sesuatu di luar kad bulat ringkas. Penjana ini meletakkan setiap bahagian tersebut pada skrin: empat peluncur penjuru dengan unit px-atau-peratusan mereka sendiri, pintasan paut-semua-penjuru untuk bentuk simetri, dan mod blob untuk bentuk yang tidak dapat diungkapkan oleh satu nilai jejari.

Mod penjuru meliputi bentuk yang sebenarnya dicari oleh orang ramai: pautkan setiap penjuru kepada satu peluncur untuk bulatan sempurna, pil dan squircle, atau nyahpautkannya untuk membulatkan hanya bahagian atas panel lungsur atau hanya satu sisi kad. Pratonton papan dam di belakang bentuk, boleh tukar antara latar belakang terang dan gelap, menjadikannya jelas dengan tepat penjuru mana yang terpotong pada sebarang jejari — helah visual yang sama digunakan oleh alat fail di laman ini untuk menunjukkan ketelusan.

Mod blob adalah separuh lagi: sintaks lapan-nilai-sengkang CSS membenarkan jejari mendatar dan menegak setiap penjuru berbeza, yang menukar segi empat tepat bulat menjadi garis luar organik tidak sekata. Tekan Rawak untuk bentuk baharu bila-bila masa dan salin CSS tepat di belakangnya — tiada eksport SVG atau pustaka luaran terlibat. Halaman praset meliputi permintaan yang sebenarnya ditaip orang dalam kotak carian: bulatan sempurna, butang pil berbentuk stadium, squircle gaya iOS, dan blob organik sedia guna.

Seperti setiap alat di laman ini, ia berjalan sepenuhnya dalam pelayar anda: tiada muat naik, tiada akaun, dan penjana terus berfungsi di luar talian setelah halaman dimuatkan.