Hi. I’m David Putney. I do UI/UX, visual design and front-end web development in the Boston area. I specialize in designing and building beautiful and functional media and content-driven websites.

Now on NPM: Convert your pixels to rems or ems using this PostCSS plugin

Two-minute read

Have you every had a dozen people coming over for dinner in 20 minutes only to discover that you need to convert a bunch of CSS with items sized in pixels over to relative sizes such as rems or ems? Who doesn’t face this problem at least several times a week.

Up until now the only way to fix this problem was to learn assembly language, make your own CPUs and write your own operating system. Well, no more!

postcss-pixels-to-rem is a PostCSS plugin that finds several types of pixel notations and converts them to either rems or ems. It is designed as a way to bring legacy SASS files written using pixels to rem mixins forward and into the postCSS world with as seamlessly as possible.

For example, it’s intended as a fix for legacy code that uses the now deprecated Bourbon px to rem and px to em mixins.

Does it work? Well, you’re soaking...