Generator prelivov

Ustvarite linearen, radialen ali stožčast preliv, dodajte barvne točke, določite smer in kopirajte CSS z enim klikom.

Vrsta preliva
Barvne točke
CSS
Prilagodite točke in smer, da oblikujete svoj preliv.

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

Pogosta vprašanja

Kakšna je razlika med linearnimi, radialnimi in stožčastimi prelivi?

Linearni preliv (linear) meša barve vzdolž ravne črte, ki jo usmerite s kotom. Radialni preliv (radial) jih širi navzven iz središča v obliki kroga ali elipse. Stožčasti preliv (conic) pa jih vrti okoli središča kot barvno kolo.

Kaj so barvne točke?

Vsaka barvna točka (color stop) je barva, pritrjena na določen položaj vzdolž preliva — 0 % na začetku, 100 % na koncu. Premaknite točko, da spremenite mesto, kjer je barva najbolj izrazita, ali dodajte več točk za bogatejše mešanje. Uporabite lahko do osem točk.

Kako določim smer preliva?

Pri linearnem ali stožčastem (conic) prelivu drsnik za kot določa smer — 0° kaže navzgor, 90° desno. Radialni preliv nima kota; namesto tega izberite obliko kroga ali elipse, da spremenite način širjenja.

Generator za CSS Cubic BezierPovlecite ročici, da oblikujete krivuljo prehoda, opazujte gibanje pike v primerjavi z enakomernim in kopirajte vrednost cubic-bezier().Generator za box-shadowPovlecite drsnike, da oblikujete senco elementa, zložite plasti za večjo globino in takoj kopirajte končni CSS.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.