Kategori: Alat pengembang
Generator Border Radius CSS
Bulatkan sudut satu per satu dengan pratinjau langsung
Geser satu penggeser per sudut lalu salin deklarasi border-radius. Aktifkan sudut elips untuk sintaks garis miring yang membentuk bentuk organik.
border-radius: 12px;
Pratinjau adalah elemen nyata dengan nilai yang diterapkan, jadi yang Anda lihat sama dengan yang digambar peramban.
Semua yang ada di halaman ini diproses di peramban Anda. Tidak ada yang diunggah.
Apa fungsi alat ini
border-radius tampak seperti satu angka sampai tiga sudut harus berbeda, dan di situlah bentuk singkatnya menjebak: keempat nilai berjalan searah jarum jam dari kiri atas, sedangkan bentuk dengan garis miring memberi tiap sudut jari-jari horizontal sebelum garis dan vertikal sesudahnya. Bentuk kedua itulah yang menggambar siluet lembut dan asimetris yang terbaca organik, bukan sekadar kotak berujung tumpul. Di sini ada penggeser untuk tiap sudut, elemen sungguhan yang nilainya benar-benar diterapkan alih-alih gambar, dan keluaran yang diringkas seperti ditulis manusia: empat sudut sama menjadi satu nilai.
Cara memakainya
- Pilih satuan dan lepaskan tautan sudut jika ingin berbeda-beda.
- Geser tiap sudut sampai pratinjaunya pas.
- Aktifkan sudut elips untuk bentuk organik, lalu salin deklarasinya.
Privasi
Alat ini berjalan sepenuhnya di peramban Anda. Masukan Anda tidak pernah diunggah, disimpan, atau dibagikan — menutup tab akan menghapusnya.
Pertanyaan yang sering diajukan
- Apa arti garis miring pada nilainya?
- Semua yang sebelum garis miring adalah jari-jari horizontal tiap sudut, dan sesudahnya jari-jari vertikal. Nilai berbeda di kedua sisi menghasilkan elips, bukan seperempat lingkaran.
- Persen atau piksel?
- Piksel mempertahankan lengkung yang sama pada ukuran apa pun, yang biasanya diinginkan tombol dan kartu. Persen ikut berskala dengan elemen: 50 persen pada persegi menghasilkan lingkaran.
- Mengapa keluaran saya kurang dari empat nilai?
- CSS meringkas sudut yang berulang, begitu pula alat ini: empat sudut sama menjadi satu nilai, dan pasangan diagonal yang sama menjadi dua. Hasilnya identik, hanya lebih pendek.