Set, Read, or Update, CSS Variables Per Each Element | css-proxied-vars

How to make use of it:

1. Install and import the css-proxied-vars.

# NPM
$ npm i css-proxied-vars

import proxiedVars from 'css-proxied-vars';
// or explicit only variant
import proxiedVars from 'css-proxied-vars/explicit';

// or
import proxiedVars from '//unpkg.com/css-proxied-vars?module';

2. Handle all :root CSS variables.

:root {
  --bg-color: #fff;
  background-color: var(--bg-color);
}

const htmlCSSVars = proxiedVars(document.documentElement);

3. Read CSS variables.

htmlCSSVars.bgColor

4. Set CSS variables.

htmlCSSVars.bgColor = 'black';
// or
htmlCSSVars['--bg-color'] = 'red';

Manipulate CSS Variables Per Each Element, css proxied vars Plugin/Github

See Demo And Download