A user wrote in the other day asking us to add this PostCSS plugin: postcss-px-to-viewport. We’re always happy to consider them as needed, and this one looks pretty neat and pretty popular.
It also blows my mind a little bit. All you do is size things in traditional units like px and it turns them into viewport units instead, making the entire UI scale together. You could just use viewport units yourself, but I guess this means you get to keep using units you have more muscle memory and a mental model for, yet get this result.
Above is me in Debug Mode checking out the weird result!
One reason I bring it up is to note the special way that options are passed to the PostCSS plugin:
@use postcss-px-to-viewport(
viewportUnit: vw,
viewportWidth: 1200
);That’s just passing two of the many options this plugin supports. Any PostCSS plugin we offer that supports options works in this same format. For example, if you want to customize Autoprefixer, you can do that the same way.
The post postcss-px-to-viewport appeared first on CodePen Blog.