CSS Filter-generator
Generer CSS-filtereffekter visuelt. Juster uskarphet, lysstyrke, kontrast, gråtoner, fargerotasjon, inversjon, opasitet, metning og sepia med live forhåndsvisning. Gratis.
Eller dra et bilde til forhåndsvisningen
Referanse
Hva er CSS filter-egenskapen?
CSS-egenskapen filter bruker grafiske effekter som uskarphet, fargeskift og kontrastjustering på et element.
Alle CSS-filterfunksjoner
blur(px): Bruker gaussisk uskarphet.
brightness(%): Justerer lysstyrke.
contrast(%): Justerer kontrast.
grayscale(%): Konverterer til gråtoner.
hue-rotate(deg): Roterer farger.
invert(%): Inverterer farger.
opacity(%): Justerer gjennomsiktighet.
saturate(%): Justerer fargemetning.
sepia(%): Bruker sepiatone.
Ytelseshensyn
CSS-filtere er GPU-akselerert i moderne nettlesere. Bruk will-change: filter på animerte elementer.
Vanlige bruksområder
Bilde hover-effekter — gråtoner i hvile, farge ved hover.
Deaktivert tilstand — filter: grayscale(100%) opacity(50%).
Mørk modus — filter: invert(1) hue-rotate(180deg).
Personvern
All filtergenerering kjøres 100% i nettleseren din. Ingen data sendes til noen server.