This is a tiny project to showcase some of the features of PostCSS and its plugins for writing next-gen CSS.
There are a quite a few plugin packs and small PostCSS plugins out there. I'll be listing the particularly neat ones here
PostCSS plugin variety packs / costco bulk purchases.
- [cssnext])(http://cssnext.io) – a ton of polyfills for bleeding edge CSS3/CSS4
- AtCSS – annotations-based CSS pre-procesing
- postcss-image-set adds background-image with first image for image-set()
- postcss-opacity adds opacity filter for IE8.
- postcss-pseudoelements Convert :: selectors into : selectors for IE 8 compatibility.
- postcss-vmin generates vm fallback for vmin unit in IE9.
- postcss-will-change inserts 3D hack before will-change property.
- autoprefixer adds vendor prefixes for you, using data from Can I Use.
- cssgrace provides various helpers and transpiles CSS 3 for IE and other old browsers.
- pixrem generates pixel fallbacks for rem units.
npm install -g postcss, open up your Node.js REPL, check out the PostCSS API docs, and go to town.
Additionally, you can check out the cssnext playground.