Generator za Border Radius

Zaoblite svaki ugao pomoću klizača, oblikujte organske mrlje pomoću eliptičnog režima i odmah kopirajte CSS.

Predlošci
Uglovi
Svi uglovi
24px
CSS
Povucite klizače da zaoblite uglove.

Svaki ugao se iscrtava direktno u Vašem pregledniku. Ništa što ovdje postavite ne šalje se na BroBroGo.

Česta pitanja

Kako funkcionišu četiri ugla i razlika između px i %?

Četiri klizača se mapiraju, u smjeru kazaljke na satu, na gornji lijevi, gornji desni, donji desni i donji lijevi ugao. U pikselima se ugao zaobljuje za fiksni iznos; u procentima se zaobljuje u odnosu na okvir — horizontalni procenat prati širinu, a vertikalni procenat prati visinu, tako da 50% pretvara kvadrat u krug.

Šta radi eliptični režim?

Kada je isključeno, svaki ugao je četvrtina kruga s jednim radijusom. Kada ga uključite, svaki ugao dobija zaseban horizontalni i vertikalni radijus, što vam omogućava da kreirate mekane, organske oblike poput mrlja. Generator automatski piše formu s kosom crtom za dvije vrijednosti i vraća se na kratku formu čim uglovi ponovo postanu okrugli.

Kako da napravim savršen krug ili oblik pilule?

Povežite uglove, prebacite na procente i postavite na 50%: kvadrat postaje krug. Za dugme u obliku pilule, zadržite piksele i povucite ugao preko polovine visine dugmeta — ivice ostaju potpuno zaobljene na bilo kojoj širini. Unaprijed podešena opcija "Krug" postavlja prvi slučaj jednim klikom.

CSS Cubic Bezier GeneratorPovucite dvije ručice da oblikujete krivu ubrzanja, posmatrajte kretanje tačke u poređenju sa ravnomjernim i kopirajte cubic-bezier() vrijednost.Generator za Box ShadowPovucite klizače da oblikujete box-shadow, slažite slojeve za dubinu i odmah kopirajte gotov CSS.Generator gradijenataKreirajte linearni, radijalni ili konusni gradijent, dodajte tačke prekida boje i postavite smjer, a zatim kopirajte CSS jednim klikom.Flexbox GeneratorPostavite flex kontejner i njegove stavke pomoću vizuelnih kontrola, posmatrajte promjene uživo i kopirajte CSS jednim klikom.CSS Grid GeneratorPostavite kolone i redove, prevucite preko ćelija da postavite stavke i kopirajte CSS mreže sa odgovarajućim HTML-om jednim klikom.Kalkulator za CSS clamp()Unesite veličinu za male i velike ekrane i dobićete fluidnu clamp() vrijednost koja se glatko skalira između njih — za veličine fonta, padding, margine ili razmake.Konverter bojaKonvertujte boje između HEX, RGB, HSL, HSV, CMYK i LAB formata — uredite bilo koje polje i ostala se ažuriraju u hodu.