-- {
  --: {
    "css": true,
    "totally": {
      "not": "controversial!"
    }
  }
}

#cool {
  font-size: 10px;
}
View Compiled
const parse = ({ cssRules }) => {
  for (let i = 0; i < cssRules.length; ++i) {
    const { cssText } = cssRules[i];
    if (cssText.startsWith("--")) {
      const cssData = JSON.parse(
        cssText.slice(cssText.charCodeAt(8) === 32 ? 9 : 8, -3)
      );
      console.log("found data in rule #", i);
      // Just proving it's a real JavaScript object...
      console.log(cssData);

      const el = document.createElement;
      document.body.insertAdjacentHTML(
        "beforeend",
        `<pre>${JSON.stringify(cssData, null, 2)}</pre>`
      );
    }
  }
};

parse(document.querySelector("style").sheet);

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.