Penjana CSS Border Radius
Reka border-radius secara visual dan dapatkan kod CSS sedia guna
Kawalan Border Radius
Pratonton Langsung
Output CSS
Contoh Penggunaan
Bulatan Sempurna
Cipta elemen bulat sempurna dengan 50% border radius pada semua sudut.
Bentuk Pil
Reka butang berbentuk pil dengan nilai border radius mendatar yang besar.
Bentuk Organik
Cipta bentuk organik unik dengan menetapkan nilai berbeza untuk setiap sudut.
Ciri-ciri
Pratonton Visual Langsung
Lihat kesan border radius dikemas kini secara masa nyata semasa anda melaraskan peluncur
Kawalan Sudut Individu
Laraskan setiap sudut secara bebas atau pautkan semuanya untuk border radius seragam
Bentuk Pratetap
Akses pantas kepada bentuk biasa seperti bulatan, pil, segi empat bulat dan tersuai
Privasi Diutamakan
Semuanya berjalan dalam pelayar anda — tiada data dihantar ke mana-mana pelayan
Cara Menggunakan?
Laraskan Sudut
Gunakan peluncur untuk menetapkan border radius setiap sudut, atau togol mod pautan untuk nilai seragam.
Pratonton Bentuk
Perhatikan kotak pratonton langsung dikemas kini serta-merta apabila anda menukar nilai jejari.
Salin CSS
Klik butang Salin CSS untuk menyalin kod border-radius yang dijana ke papan keratan anda.
Soalan Lazim
Apa Yang Alat Ini Lakukan?
Penjana border-radius ini membolehkan anda mereka bentuk sudut bulat untuk elemen CSS secara visual. Seret peluncur, lihat pratonton dikemas kini secara masa nyata, dan salin CSS yang dijana dengan satu klik. Tidak perlu lagi meneka nilai piksel dalam helaian gaya anda.
Cara border-radius Berfungsi dalam CSS
Sifat CSS border-radius menerima nilai dalam piksel, peratusan atau em untuk setiap sudut. Anda boleh tetapkan keempat-empat sudut sekaligus dengan singkatan (border-radius: 10px) atau kawal setiap satu secara berasingan. Peratusan adalah relatif kepada dimensi elemen, itulah sebabnya 50% pada persegi menghasilkan bulatan.
Bentuk Pratetap dan Reka Bentuk Tersuai
Mulakan dengan cepat menggunakan pratetap untuk bulatan, bentuk pil dan segi empat bulat. Atau eksperimen dengan nilai asimetri pada setiap sudut untuk mencipta bentuk organik yang menjadi trend dalam reka bentuk antara muka moden.
Serasi dengan Semua Pelayar Moden
Sifat border-radius disokong oleh Chrome, Firefox, Safari dan Edge. Sintaks singkatan yang dijana oleh alat ini adalah format paling serasi, jadi anda boleh tampalkannya terus ke dalam projek anda tanpa awalan vendor.