Une remarque ? Une suggestion ?...

Merci de participer à l'amélioration de ce site. Prenez le temps de rédiger votre remarque le plus précisément possible :

CSS - Fonction contrast()

Description de la fonction contrast().

La fonction contrast() modifie le contraste d'une image. Le contraste étant l'écart entre les tons sombres et les tons clairs. Le contraste peut être augmenté ou réduit suivant la valeur du paramètre donné à la fonction.

La fonction contrast() peut être utilisée avec :

  • backdrop-filter : Applique un filtre graphique sur l'élément situé en arrière plan.
  • filter : Filtre graphique.

Syntaxe de la fonction contrast().

  • filter: contrast(50%); n

    n indique l'importance du changement de contraste.
    C'est une valeur numérique positive sans unité ou un pourcentage.

    1. 0 indique une perte totale du contraste (une image grise).
    2. Une valeur entre 0 et 1 (ou entre 0% et 100%) indique une réduction du contraste.
    3. 1 ou 100% conserve le contraste initial de l'image.
    4. Une valeur supérieure à 1 ou à 100% correspond à une augmentation du contraste.

Simulateur.

filter:
( n )

Voir aussi...

Images et filtres - Propriétés.

  • backdrop-filter : Applique un filtre graphique sur l'élément situé en arrière plan.
  • background-blend-mode : Définit le mélange des couleurs entre image(s) d'arrière-plan et couleur d'arrière-plan.
  • clip-path : Définit la partie visible de l'élément, délimitée par une forme géométrique (rectangle, polygone...)
  • filter : Filtre graphique.
  • image-rendering : Mode de mise à l'échelle des images.
  • mix-blend-mode : Définit le mode de mélange entre le contenu et ce qui est visible en arrière-plan de l'élément.

Images et filtres - Fonctions.

  • blur() : Applique un effet de flou à une image.
  • brightness() : Ajuste la luminosité d'une image.
  • drop-shadow() : Définit l'ombre d'un élément (dimensions, flou, couleur).
  • grayscale() : Convertit une image en nuances de gris (noir et blanc).
  • hue-rotate() : Change les couleurs d'une image (rotation des teintes).
  • image() : Désigne ou définit une image.
  • inset() : Définit un rectangle, utilisable pour découper une image.
  • invert() : Inverse les couleurs d'une image.
  • opacity() : Détermine le degré de transparence d'un élément.
  • saturate() : Définit la saturation des couleurs d'une image.
  • sepia() : Applique un effet sépia à une image.