grayscale()

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2016.

Die grayscale() CSS Funktion konvertiert das Eingabebild in Graustufen. Das Ergebnis ist eine <filter-function>.

css

grayscale(amount)

amount: Der Anteil des Eingabebildes, der in Graustufen umgewandelt wird. Es wird entweder als <number> oder als <percentage> angegeben. Ein Wert von 100% wandelt das Eingabebild vollständig in Graustufen um, während ein Wert von 0% das Eingabebild unverändert lässt. Werte zwischen 0% und 100% haben lineare Multiplikatoren auf den Effekt. Wenn der grayscale()-Filter ohne Parameter vorhanden ist, ist der Standardwert 1. Der anfängliche Wert, der für die Interpolation verwendet wird, ist 0.

<grayscale()> = 
  grayscale( [ <number> | <percentage> ]? )

css

grayscale(0)     /* No effect */
grayscale(.7)    /* 70% grayscale */
grayscale(100%)  /* Completely grayscale */

Specification
Filter Effects Module Level 1 # funcdef-filter-grayscale

BCD tables only load in the browser

Die anderen <filter-function> Funktionen, die bei den Werten der filter und backdrop-filter Eigenschaften verwendet werden können, sind: