Generator za box-shadow

Povlecite drsnike, da oblikujete senco elementa, zložite plasti za večjo globino in takoj kopirajte končni CSS.

Plasti sence
Plast 1
CSS
Prilagodite drsnike, da oblikujete svojo senco.

Vsaka senca se izriše v vašem brskalniku. Nič od tega, kar nastavite tukaj, se ne prenaša na BroBroGo.

Pogosta vprašanja

Kaj natančno določajo odmik, zameglitev in razširitev?

Odmik (offset) premakne senco levo/desno in gor/dol, zameglitev (blur) zmehča njene robove, razširitev (spread) pa jo poveča ali pomanjša pred zameglitvijo. Negativna razširitev potegne senco navznoter, kar je uporabno za tesne, bližnje sence.

Kaj naredi možnost inset?

Običajna senca pade izven elementa, kot svetloba za dvignjeno kartico. Možnost Inset jo obrne navznoter, tako da je element videti vtisnjen — priročno za vdolbena vnosna polja ali pritisnjene gumbe.

Zakaj bi uporabili več kot eno plast sence?

Ena sama senca je nad določeno velikostjo videti ploska. Realistična globina običajno združuje tesno, temno senco z mehko, širšo senco — dodajte drugo plast in prilagodite vsako posebej, da dosežete ta učinek.

Generator za CSS Cubic BezierPovlecite ročici, da oblikujete krivuljo prehoda, opazujte gibanje pike v primerjavi z enakomernim in kopirajte vrednost cubic-bezier().Generator prelivovUstvarite linearen, radialen ali stožčast preliv, dodajte barvne točke, določite smer in kopirajte CSS z enim klikom.Generator za border-radiusZaoblite vsak kot z drsniki, oblikujte organske mehurčke z eliptičnim načinom in takoj kopirajte CSS.Generator za FlexboxNastavite flex vsebnik in njegove elemente z vizualnimi kontrolami, opazujte odziv postavitve v živo in kopirajte CSS z enim klikom.CSS Grid GeneratorDoločite stolpce in vrstice, povlecite čez celice za postavitev elementov ter z enim klikom kopirajte CSS mreže z ustreznim HTML-jem.Kalkulator za CSS clamp()Vnesite velikost za male in velike zaslone ter pridobite tekočo vrednost clamp(), ki se vmes gladko prilagaja — za velikosti pisav, paddinge, margine ali gape.Pretvornik barvPretvorite barve med formati HEX, RGB, HSL, HSV, CMYK in LAB — uredite katero koli polje in ostala se bodo sproti posodobila.CSS polepševalnik in pomanjševalnikZamaknite neurejen CSS za lažje branje ali ga pomanjšajte za objavo – z varnim načinom, ki nikoli ne spreminja vrstnega reda pravil.Preverjevalnik kontrastaVnesite barvo besedila in ozadja, da preverite kontrastno razmerje WCAG ter skladnost z ravnmi AA in AAA.