grayscale()

La fonction CSS grayscale() convertit une image en niveaux de gris. Le résultat de cette fonction est une valeur <filter-function>.

Exemple interactif

Syntaxe

css
grayscale(multiplicateur)

Paramètres

multiplicateur

L'intensité de la conversion, indiquée sous la forme d'un nombre (<number>) ou d'un pourcentage (<percentage>). Avec une valeur égale à 100%, l'image obtenue sera complètement en niveaux de gris. Avec une valeur égale à 0%, l'image source restera inchangée. Les valeurs comprises entre 0% et 100% auront un effet intermédiaire (progression linéaire). Dans le cas d'une interpolation, la valeur par défaut utilisée est 0.

Exemples

Exemples de valeurs correctes pour grayscale()

css
grayscale(0)     /* Aucun effet */
grayscale(.7)    /* Converti à 70% en niveaux de gris */
grayscale(100%)  /* Uniquement en niveaux de gris */

Spécifications

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

Compatibilité des navigateurs

BCD tables only load in the browser

Voir aussi