CSS-Filter-Generator
Ein visuelles Werkzeug zum Generieren und Vorschau von CSS-Filtereigenschaften.
Filtereinstellungen
Passen Sie jede Filtereigenschaft an
Voreinstellungen
Probieren Sie vordefinierte Filterstile aus
Vorschau
Sehen Sie die generierten Filtereffekte auf dem Standardbild
Original
Gefiltert
Filter Preview
Generiertes CSS
filter: none;Erläuterung der CSS-Filterfunktionen
Visuelle Effekte
- • blur(px): Unschärfeeffekt
- • brightness(%): Helligkeitsanpassung
- • contrast(%): Kontrastanpassung
- • opacity(%): Deckkraftanpassung
Farbeffekte
- • grayscale(%): Graustufeneffekt
- • hue-rotate(deg): Farbtonrotation
- • invert(%): Farbumkehrung
- • saturate(%): Sättigungsanpassung
- • sepia(%): Sepia-Effekt
Verwendungstipps
- • Kombinieren Sie mehrere Filter durch Leerzeichen getrennt
- • Auf jedes HTML-Element anwenden, nicht nur auf Bilder
- • Verwenden Sie mit CSS-Animationen für dynamische Effekte
- • Verwenden Sie backdrop-filter, um nur auf Hintergründe anzuwenden