Border Radius ģenerators

Noapaļojiet katru stūri ar slīdņiem, veidojiet organiskas lāses formas ar eliptisko režīmu un acumirklī nokopējiet CSS.

Sagataves
Stūri
Visi stūri
24px
CSS
Velciet slīdņus, lai noapaļotu stūrus.

Katrs stūris tiek zīmēts tieši jūsu pārlūkprogrammā. Nekas no tā, ko šeit iestatāt, netiek augšupielādēts BroBroGo.

BUJ

Kā darbojas četri stūri un px pret %?

Četri slīdņi pulksteņrādītāja virzienā atbilst augšējam kreisajam, augšējam labajam, apakšējam labajam un apakšējam kreisajam stūrim. Pikseļos stūris tiek noapaļots par fiksētu lielumu; procentos tas tiek noapaļots attiecībā pret lodziņu — horizontālais procents seko platumam, bet vertikālais — augstumam, tāpēc 50% pārvērš kvadrātu par apli.

Ko dara eliptiskais režīms?

Kad šis režīms ir izslēgts, katrs stūris ir ceturtdaļa apļa ar vienu rādiusu. Ieslēdzot to, katrs stūris iegūst atsevišķu horizontālo un vertikālo rādiusu, kas ļauj veidot mīkstas, organiskas "lāses" formas. Ģenerators automātiski izveido divu vērtību slīpsvītras formu un atgriežas pie īsās formas, kad stūri atkal ir apaļi.

Kā izveidot perfektu apli vai kapsulas formu?

Sasaistiet stūrus, pārslēdzieties uz procentiem un iestatiet 50%: kvadrāts kļūs par apli. Lai izveidotu kapsulas formas pogu, saglabājiet pikseļus un velciet stūri pāri pusei no pogas augstuma — malas paliks pilnībā noapaļotas jebkurā platumā. Apli iestatītais sagatave (Circle) veic pirmo gadījumu ar vienu klikšķi.