La valeur currentColor en CSS

currentColor est un mot-clé spécial en CSS très utile pour des styles plus dynamiques et maintenables : il représente la valeur calculée de la propriété color (c'est-à-dire la couleur du texte) de l'élément dans lequel il est appliqué. Il n'est pas tout récent (depuis ~2010 !) mais reste souvent méconnu ou sous-utilisé. Il s'agit donc d'une variable dynamique qui prend la valeur de la propriété color actuelle de l'élément. Si vous utilisez currentColor pour définir la couleur d'une bordure, d'un arrière-plan ou d'une ombre, cette propriété adoptera automatiquement la même couleur que le texte de cet élément. L'avantage principal est que si vous changez la couleur de texte via la propriété color de l'élément, toutes les propriétés utilisant currentColor seront mises à jour automatiquement, sans avoir besoin de les modifier individuellement. Don't Repeat Yourself !

Mai 8, 2025 - 10:18
 0
La valeur currentColor en CSS

currentColor est un mot-clé spécial en CSS très utile pour des styles plus dynamiques et maintenables : il représente la valeur calculée de la propriété color (c'est-à-dire la couleur du texte) de l'élément dans lequel il est appliqué. Il n'est pas tout récent (depuis ~2010 !) mais reste souvent méconnu ou sous-utilisé.

Il s'agit donc d'une variable dynamique qui prend la valeur de la propriété color actuelle de l'élément. Si vous utilisez currentColor pour définir la couleur d'une bordure, d'un arrière-plan ou d'une ombre, cette propriété adoptera automatiquement la même couleur que le texte de cet élément.

L'avantage principal est que si vous changez la couleur de texte via la propriété color de l'élément, toutes les propriétés utilisant currentColor seront mises à jour automatiquement, sans avoir besoin de les modifier individuellement. Don't Repeat Yourself !