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