Generator za Box Shadow

Povucite klizače da oblikujete box-shadow, slažite slojeve za dubinu i odmah kopirajte gotov CSS.

Slojevi sjenke
Sloj 1
CSS
Podesite klizače da oblikujete svoju sjenku.

Svaka sjenka se iscrtava u Vašem pregledniku. Ništa što ovdje postavite ne šalje se na BroBroGo.

Česta pitanja

Šta zapravo kontrolišu pomak, zamućenje i širenje?

Pomak (offset) pomjera sjenku lijevo/desno i gore/dole, zamućenje (blur) omekšava njene ivice, a širenje (spread) je povećava ili smanjuje prije zamućenja. Negativno širenje uvlači sjenku unutra, što je korisno za uske, bliske sjenke.

Šta radi opcija unutrašnje sjenke (inset)?

Normalna sjenka pada izvan elementa, poput svjetlosti iza podignute kartice. Unutrašnja sjenka (inset) je prebacuje unutra, tako da element izgleda utisnuto — što je korisno za udubljena polja za unos ili pritisnuta dugmad.

Zašto slagati više od jednog sloja sjenke?

Jedna sjenka izgleda ravno preko određene veličine. Realistična elevacija obično kombinuje usku, tamnu sjenku sa mekom, širom sjenkom — dodajte drugi sloj i podesite svaki nezavisno da biste postigli taj efekat.

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 gradijenataKreirajte linearni, radijalni ili konusni gradijent, dodajte tačke prekida boje i postavite smjer, a zatim kopirajte CSS jednim klikom.Generator za Border RadiusZaoblite svaki ugao pomoću klizača, oblikujte organske mrlje pomoću eliptičnog režima i odmah kopirajte CSS.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.CSS Beautifier & MinifierPonovo uvucite neuredan CSS radi lakšeg čitanja ili ga minifikujte za brže učitavanje — uz siguran režim koji nikada ne mijenja redoslijed vaših pravila.Provjera kontrastaUnesite boju teksta i pozadine da vidite WCAG omjer kontrasta i koji AA i AAA nivoi zadovoljavaju.