How to Get All Custom Properties on a Page in JavaScript

We can use JavaScript to get the value of a CSS custom property. Robin wrote up a detailed explanation about this in Get a CSS Custom Property Value with JavaScript. To review, lets say weve declared a single custom property on the HTML element:

html { --color-accent: #00eb9b;}

In JavaScript, we can access the value with getComputedStyle and getPropertyValue:

const colorAccent = getComputedStyle(document.documentElement) .getPropertyValue('--color-accent'); // #00eb9b

Perfect. Now we have access to our accent color in JavaScript. … Read article “How to Get All Custom Properties on a Page in JavaScript”

The post How to Get All Custom Properties on a Page in JavaScript appeared first on CSS-Tricks.