Generator filtrov CSS
Ustvarjanje in vizualizacija filtrov slik CSS po meri
Preview
CSS Code
Kontrolniki filtrov
Priljubljeni filtri
Vintage
Neon Glow
Polaroid
Starinski film
Digitalna umetnost
Kako uporabljati filtre CSS
Kaj so filtri CSS?
CSS filtri vam omogočajo, da na element uporabite grafične učinke, kot sta zameglitev ali spreminjanje barv. Običajno se uporabljajo za slike, ozadja in obrobe.
Filtre je mogoče uporabiti za ustvarjanje vizualnih učinkov, izboljšanje slik ali ustvarjanje edinstvenih oblikovnih elementov brez potrebe po zunanjih orodjih za urejanje slik.
Podprte lastnosti filtrov CSS
-
blur()- Elementu uporabi Gaussovo zameglitev. -
brightness()- Prilagodi svetlost elementa. -
contrast()- Prilagodi kontrast elementa. -
grayscale()- Pretvori element v sivinske odtenke. -
hue-rotate()- Elementu uporabi rotacijo odtenka. -
invert()- Invertira barve elementa. -
opacity()- Prilagodi motnost elementa. -
saturate()- Nasiči ali razsiči element. -
sepia()- Pretvori element v sepijo.
Kako uporabiti filtre
Z uporabo kode CSS, ki jo ustvari to orodje, lahko filtre uporabite za kateri koli element HTML. To storite tako:
1. Izberite element
Izberite element HTML, na katerega želite uporabiti filter. To je lahko slika, ozadje ali kateri koli drug element.
2. Dodajte razred ali ID
Če element še nima razreda ali ID-ja, ga dodajte, da ga boste lažje ciljali s CSS-jem.
3. Uporabite filter
Uporabite CSSfilterlastnost v slogovni predlogi ali vgrajenem slogu, da uporabite ustvarjeni filter.
.filtered-image { filter: blur(5px) brightness(110%) contrast(120%); }
4. Združite več filtrov
Več funkcij filtrov lahko kombinirate tako, da jih naštejete eno za drugo, ločene s presledki.
filter: blur(2px) brightness(110%) contrast(120%) saturate(150%);
Združljivost brskalnikov
Filtri CSS so široko podprti v sodobnih brskalnikih, vključno s Chromeom, Firefoxom, Safarijem, Edgeom in Opero. Vendar pa jih starejši brskalniki, kot je Internet Explorer, ne podpirajo.
Related Tools
Pretvornik pisala v CSS
Pretvorite svojo kodo SCSS v CSS. Hitro, enostavno in varno.
Olepševalec CSS
Oblikujte in polepšajte svojo kodo CSS s profesionalno natančnostjo
Spletni generator CSS senc besedila
Ustvarite osupljive učinke preliva besedila za svojo spletno stran
Število delov na pretvornik
Natančno pretvarjajte med deli na milijon (ppm), deli na milijardo (ppb), deli na bilijon (ppt), odstotki in drugimi vrednostmi
Pretvornik slik v Base64
Pretvorba slik v kodiranje Base64 za spletni razvoj in vdelavo podatkov
Učinek besedila CSS Glitch
S tem interaktivnim generatorjem ustvarite osupljive učinke napak za svoje besedilo. Popolno za kiberpunk, igranje iger ali katero koli oblikovanje, ki potrebuje drzen, futurističen videz.