Generator CSS Border Radius
Rancang border-radius CSS secara visual dengan pratinjau langsung dan salin kode yang siap pakai.
border-radius: —;
100% privat — semuanya berjalan di peramban Anda. Tidak ada yang diunggah.
Tentang Generator CSS Border Radius
CSS Border Radius Generator membuat segala sesuatu mulai dari kartu bersudut lembut hingga bentuk blob organik. Seret handle sudut langsung pada pratinjau, atau atur setiap sudut secara numerik — termasuk sintaks delapan nilai lengkap, di mana setiap sudut memiliki radius horizontal dan vertikal terpisah. Sumbu kedua itulah yang membuka kemungkinan bentuk telur, daun, tetesan air mata dan blob.
Sakelar "link corners" menjaga keempat sudut tetap sinkron untuk pembulatan seragam klasik, sementara melepas sinkronisasinya membebaskan setiap sudut untuk bentuk asimetris. Dua belas preset — rounded, pill, circle, squircle, dua blob, leaf, egg, arch, teardrop, petal dan wave — menunjukkan kemampuan properti ini, dan tombol acak menghasilkan bentuk organik baru tanpa henti.
Anda bisa mengubah satuan, mewarnai ulang elemen dan kanvas agar sesuai desain Anda, serta menyalin nilai border-radius polos atau aturan CSS lengkap. Alat ini 100% berjalan di sisi klien — tidak ada yang diunggah.
Cara menggunakan Generator CSS Border Radius
- Seret handle sudut pada pratinjau, atau matikan "Link all corners" untuk mengedit setiap sudut secara terpisah.
- Atur radius horizontal dan vertikal per sudut untuk bentuk organik menyerupai blob.
- Pilih satuan Anda dan sesuaikan warna elemen serta latar belakang untuk pratinjau dalam konteks.
- Coba preset — pill, squircle, blob, leaf, teardrop dan lainnya — atau tekan acak.
- Salin nilai border-radius atau CSS lengkapnya.