Penjana Border Radius

Bulatkan setiap bucu dengan gelongsor, bentuk gumpalan organik dengan mod elips, dan salin CSS serta-merta.

Pratetap
Bucu
Semua bucu
24px
CSS
Seret gelongsor untuk membulatkan bucu anda.

Setiap bucu dilukis terus dalam penyemak imbas anda. Tiada apa-apa yang anda tetapkan di sini akan dimuat naik ke BroBroGo.

Soalan Lazim

Bagaimanakah empat bucu dan px lwn % berfungsi?

Empat gelongsor dipetakan, mengikut arah jam, ke bucu atas-kiri, atas-kanan, bawah-kanan dan bawah-kiri. Dalam piksel, bucu dibulatkan mengikut jumlah tetap; dalam peratusan, ia dibulatkan secara relatif kepada kotak — peratusan mendatar mengikut lebar dan peratusan menegak mengikut ketinggian, jadi 50% menukar segi empat sama menjadi bulatan.

Apakah fungsi mod elips?

Jika dimatikan, setiap bucu ialah suku bulatan dengan satu jejari. Hidupkannya dan setiap bucu mendapat jejari mendatar dan menegak yang berasingan, yang membolehkan anda membina bentuk "gumpalan" (blob) organik yang lembut. Penjana menulis borang serong dua nilai untuk anda dan kembali ke borang pendek sebaik sahaja bucu menjadi bulat semula.

Bagaimanakah cara saya membuat bulatan sempurna atau bentuk pil?

Pautkan bucu, tukar kepada peratusan dan tetapkan 50%: segi empat sama akan menjadi bulatan. Untuk butang berbentuk pil, kekalkan piksel dan seret bucu melepasi separuh ketinggian butang — bahagian tepi akan kekal bulat sepenuhnya pada sebarang lebar. Pratetap Bulatan menetapkan kes pertama dalam satu klik.

Penjana CSS Cubic BezierSeret dua pemegang untuk membentuk keluk pelonggaran, lihat titik bergerak melaluinya berbanding keluk yang stabil, dan salin nilai cubic-bezier().Penjana Box ShadowSeret gelongsor untuk membentuk box-shadow, susun lapisan untuk kedalaman, dan salin CSS yang telah siap serta-merta.Penjana KecerunanBina kecerunan linear, jejarian atau konik, tambah hentian warna dan tetapkan arah, kemudian salin CSS dalam satu klik.Penjana FlexboxSediakan bekas flex dan itemnya dengan kawalan visual, lihat reka letak bertindak balas secara langsung, dan salin CSS dalam satu klik.Penjana CSS GridTetapkan lajur dan baris anda, seret merentasi sel untuk meletakkan item, dan salin CSS grid dengan HTML yang sepadan dalam satu klik.Kalkulator CSS clamp()Masukkan saiz untuk skrin kecil dan besar dan dapatkan nilai clamp() bendalir yang diskalakan dengan lancar di antaranya — untuk saiz fon, padding, margin atau gap.Penukar WarnaTukar warna antara HEX, RGB, HSL, HSV, CMYK dan LAB — edit mana-mana medan dan yang lain akan dikemas kini semasa anda menaip.