Package Exports
- css-vars-ponyfill
- css-vars-ponyfill/dist/css-vars-ponyfill.esm.js
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (css-vars-ponyfill) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
css-vars-ponyfill
A ponyfill that provides client-side support for CSS custom properties (aka "CSS variables") in legacy and modern browsers.
- Documentation
- Demo (CodePen)
Features
- Client-side transformation of CSS custom properties to static values
- Live updates of runtime values in both modern and legacy browsers
- Transforms
<link>,<style>, and@importCSS - Transforms relative
url()paths to absolute URLs - Supports chained and nested
var()functions - Supports
var()function fallback values - Supports web components / shadow DOM CSS
- Watch mode auto-updates on
<link>and<style>changes - UMD and ES6 module available
- TypeScript definitions included
- Lightweight (6k min+gzip) and dependency-free
Limitations
- Custom property declaration support is limited to
:rootand:hostrulesets - The use of
var()is limited to property values (per W3C specification)
Browser Support
| IE | Edge | Chrome | Firefox | Safari |
|---|---|---|---|---|
| 9+ | 12+ | 19+ | 6+ | 6+ |
Contact
- Create a Github issue for bug reports, feature requests, or questions
- Follow @jhildenbiddle for announcements
- Add a ⭐️ star on GitHub or ❤️ tweet to support the project!
License
This project is licensed under the MIT License. See the MIT LICENSE for details.
Copyright (c) John Hildenbiddle (@jhildenbiddle)