CSS custom properties polyfill for ie11

Question

Is there a way to pollyfill a custom CSS property for ie11 with JavaScript? I was thinking on load, check if browser supports custom properties and if not do some kind of find a

Answer 1

Yes, so long as you're processing root-level custom properties (IE9+).

• GitHub: https://github.com/jhildenbiddle/css-vars-ponyfill
• NPM: https://www.npmjs.com/package/css-vars-ponyfill
• Demo: https://codepen.io/jhildenbiddle/pen/ZxYJrR

From the README:

Features

• Client-side transformation of CSS custom properties to static values
• Live updates of runtime values in both modern and legacy browsers
• Transforms ,

  Transforms web components / shadow DOM

  
    #shadow-root
      
      
  Hello.
  
  

  For the sake of completeness: w3c specs

  Hope this helps.

  (Shameless self-promotion: Check)