color-contrast()

Expérimental: Cette fonction est expérimentale
Puisque cette fonction est toujours en développement dans certains navigateurs, veuillez consulter le tableau de compatibilité pour les préfixes à utiliser selon les navigateurs.
Il convient de noter qu'une fonctionnalité expérimentale peut voir sa syntaxe ou son comportement modifié dans le futur en fonction des évolutions de la spécification.

La notation fonctionnelle color-contrast() prend une couleur et la compare à une liste d'autres couleurs (voir <color> pour les valeurs possibles) afin de sélectionner la valeur de la liste qui offre le contraste le plus important avec la première couleur.

Syntaxe

css
color-contrast(wheat vs tan, sienna, #d2691e)
color-contrast(#008080 vs olive, var(--myColor), #d2691e)

Valeurs

color-contrast( <couleur> vs <couleur>#{2,} )

<couleur> est une valeur de type <color>.

<couleur>#{2,} est une liste de couleurs (type <color>) séparées par des virgules, à comparer à la première.

Spécifications

Specification
CSS Color Module Level 6
# colorcontrast

Compatibilité des navigateurs

BCD tables only load in the browser