Le variabili CSS sono molto comode quando dobbiamo creare i file CSS per le nostre applicazioni, ma la loro visibilità non si ferma ai soli file CSS. Una delle funzionalità più importanti delle variabili CSS consiste nella possibilità di leggerne e impostarne il valore tramite JavaScript.
Per accedere al valore di una variabile dobbiamo accedere allo stile che la definisce tramite il metodo getComputedStyle o tramite la proprietà style di un elemento a cui è associato lo stile che contiene la variabile. Una volta ottenuto lo stile, usiamo i metodi getPropertyValue e setProperty per leggere e scrivere il valore della variabile.
Il metodo getPropertyValue accetta in input il nome della variabile e ne restituisce il valore mentre il metodo setProperty prende in input il nome della variabile e il valore da impostare.

// legge il valore dallo stile di un elemento
element.style.getPropertyValue("--my-var");

//legge lo stile da qualunque elemento e recupera il valore della variabile
getComputedStyle(element).getPropertyValue("--my-var");

// imposta il valore della variabile
element.style.setProperty("--my-var", "10px");