Accéder à une variable CSS en JavaScript

Pour accéder à une variable CSS définie comme suit :

:root {
  --secondary-color: #336699;
}

On peut utiliser le JavaScript suivant :

let secondaryColor = window.getComputedStyle(document.documentElement).getPropertyValue('--secondary-color')

Si elle est surchargée dans un élément

h2 {
  --secondary-color: #669933;
}

Il faut aller la chercher dans le style de l’élément :

let secondaryColor = window.getComputedStyle(document.querySelector('h2')).getPropertyValue('--secondary-color')

Source : https://developer.mozilla.org/fr/docs/Web/CSS/CSS\_cascading\_variables/Using\_CSS\_custom\_properties#manipulation\_des\_variables\_en\_javascript