filter: brightness(105%) contrast(110%) saturate(130%) sepia(45%);Der CSS-Filtergenerator ist ein visueller Editor für die CSS-Filter-Eigenschaft. Sie bewegen einen Schieberegler für jede Filterfunktion – Unschärfe, Helligkeit, Kontrast, Sättigung, Graustufen, Sepia, Invert, Farbton und Deckkraft – und beobachten, wie der Effekt in Echtzeit auf eine Vorschau angewendet wird, und dann die exakten CSS-Dateien kopieren.
Die Filtereigenschaft wendet grafische Effekte wie Unschärfe, Farbverschiebung und Kontrastanpassung direkt im Browser an, ohne dass ein Bildeditor erforderlich ist. Mehrere Funktionen können in einer einzigen Deklaration verkettet werden und werden in der Reihenfolge angewendet, so wie Vintage, warm und dramatisch aussehen. Dieses Tool verwaltet diese Kette für Sie und gibt nur die Funktionen aus, die Sie tatsächlich geändert haben, und halten das CSS sauber.
Alles passiert in Ihrem Browser. Beginnen Sie mit einer Voreinstellung wie Vintage oder Graustufen, stimmen Sie jede Funktion ab und kopieren Sie die Deklaration. Kein Konto, kein Upload und es funktioniert weiterhin offline, sobald die Seite geladen wurde.
Wählen Sie eine Voreinstellung wie Vintage, Warm, Cool, Dramatische oder Graustufen für einen sofortigen Look oder starten Sie mit dem Standard (keine Filter angewendet).
Ziehen Sie die Schieberegler für Unschärfe, Helligkeit, Kontrast, Sättigung, Graustufen, Sepia, Invert, Farbton und Deckkraft. Die Vorschau wird sofort aktualisiert, sodass Sie den genauen Look wählen können.
Überlagern Sie mehrere Funktionen zusammen – zum Beispiel Sepia plus Kontrast plus Sättigung für einen warmen Film-Look. Das Werkzeug verkettet sie in der richtigen Reihenfolge automatisch.
Kopieren Sie die generierte Filterdeklaration, die nur die von Ihnen geänderten Funktionen enthält, und fügen Sie sie in ein Element oder Bild in Ihrem Stylesheet ein.
Unschärfe, Helligkeit, Kontrast, Sättigen, Graustufen, Sepia, Invert, Farbton und Deckkraft — jede gängige CSS-Filterfunktion mit einem dedizierten Schieberegler
Nur die Funktionen, die Sie tatsächlich ändern, werden in die Deklaration geschrieben, sodass Sie niemals redundante Identitätswerte wie Helligkeit (100%) versenden
Eine Vorschau wird beim Ziehen sofort aktualisiert, sodass Sie den kombinierten Effekt jedes Filters sehen können, bevor Sie eine einzelne Zeile von CSS kopieren
Kuratierte Rezepte für Vintage, warm, kühl, dramatisch, verblasst, Graustufen, Invertierung und Unschärfe geben Ihnen einen bewährten Ausgangspunkt anstelle einer leeren Leinwand
Create beautiful CSS gradients with live preview
Design layered CSS box-shadows with a live preview and sliders for offset, blur, spread, color, opacity, and inset — then copy production-ready CSS.
Pick colors and convert between HEX, RGB, and HSL formats
0 comments
No comments yet. Be the first to share your thoughts!