Loading...


CSS Sättigungsgenerator

Konfiguration

Saturate

Klasse

Vorschau

Parliament of Hungary, Budapest

Code

ReadyTools Academy

Kommt bald

Lerne HTML, CSS und JavaScript kostenlos mit der ReadyTools Academy.

Verfolge deinen Lernfortschritt, wachse in deinem Tempo und habe Spaß dabei! 🎯

CSS Sättigungsgenerator

In CSS können Sie den Sättigungseffekt auf Elemente mit der Filter-Eigenschaft anwenden. Der Sättigungseffekt steuert die Sättigung oder Intensität der Farben in einem Element. Ein höherer Prozentwert erhöht die Sättigung, wodurch die Farben lebendiger werden, während ein niedrigerer Prozentwert die Farben entsättigt, wodurch sie eher Graustufen erscheinen.

So können Sie den Sättigungseffekt in CSS verwenden:

.saturate-element { filter: saturate(200%); }

In diesem Beispiel:

  • Die Klasse '.saturate-element' wendet den Sättigungseffekt auf das Element an, auf das sie abzielt.
  • saturate(200%) gibt eine Sättigung von 200 % an, was bedeutet, dass die Farben des Elements verstärkt werden, wodurch sie lebendiger und gesättigter werden.

Sie können den Prozentwert anpassen, um den Sättigungsgrad zu steuern. Beispielsweise würde saturate(50%) zu einer reduzierten Sättigung führen, wodurch ein weniger lebendiges Erscheinungsbild entsteht.

Hier ist ein weiteres Beispiel mit reduzierter Sättigung:

.reduced-saturation-element { filter: saturate(75%); }

In diesem Fall wendet die Klasse '.reduced-saturation-element' einen Sättigungseffekt von 75 % an, wodurch die Farben weniger intensiv werden.

Der Sättigungseffekt ist ein nützliches Werkzeug, um die Farbintensität von Elementen auf Ihrer Webseite zu manipulieren, sodass Sie verschiedene visuelle Stile und Effekte erstellen können.


Top-Werkzeuge

CodeHubBoardly NEULinksy NEUChromo NEU

Sprache wählen

Thema wählen

© 2025 ReadyTools. Alle Rechte vorbehalten.