Variables and JavaScript

CSS Variables + JS

JavaScript can read and write CSS variables, enabling runtime theming without class toggling.

Example

const root = document.documentElement;
const val = getComputedStyle(root).getPropertyValue("--primary").trim();
root.style.setProperty("--primary", "#e91e63");

JAVASCRIPT

Full Editor

Pro Tip

Changing :root CSS variables re-themes the entire page instantly.

Related Resources

CSS Reference

Complete tag & property list

CSS How-To Guides

Step-by-step practical guides

CSS Exercises

Practice what you've learned