Liigu sisuni

CSS Filtri generaator

Loo CSS filtriefekte visuaalselt. Kohanda hägu, heledus, kontrast, halltoonid, toonipööre, ümberpööramine, läbipaistmatus, küllastus ja seepia reaalajas eelvaatega. Tasuta.

Või lohista pilt eelvaatele

0px
100%
100%
0%
0deg
0%
100%
100%
0%
 

Mis on CSS filter omadus?

CSS omadus filter rakendab elemendile graafilisi efekte nagu hägu, värvinihe ja kontrastikohandus.

Kõik CSS filtri funktsioonid

blur(px): Rakendab Gaussi hägu.
brightness(%): Kohandab heledust.
contrast(%): Kohandab kontrasti.
grayscale(%): Teisendab halltoonidesse.
hue-rotate(deg): Pöörab värve.
invert(%): Pöörab värvid ümber.
opacity(%): Kohandab läbipaistvust.
saturate(%): Kohandab värviküllastust.
sepia(%): Rakendab seepiatooni.

Jõudluse kaalutlused

CSS filtrid on GPU-kiirendatud kaasaegsetes brauserites. Kasuta will-change: filter animeeritud elementidel.

Levinumad kasutusjuhud

Pildi hover-efektid — halltoonid puhkeolekus, värv hõljumisel.
Keelatud olekfilter: grayscale(100%) opacity(50%).
Tume režiimfilter: invert(1) hue-rotate(180deg).

Privaatsus

Kogu filtrite genereerimine toimub 100% sinu brauseris. Andmeid ei saadeta serverisse.