postcss-normalize

What is postcss-normalize?

The postcss-normalize package integrates the normalize.css library with PostCSS, allowing developers to include normalize.css in their projects as a PostCSS plugin. This package helps in ensuring that browsers render all elements more consistently and in line with modern standards. It automatically imports the parts of normalize.css that you need, based on your project's browserlist configuration.

What are postcss-normalize's main functionalities?

Browser normalization

Automatically includes the relevant parts of normalize.css based on the browsers specified in your project's browserlist. This feature ensures that your CSS behaves more consistently across different browsers.

postcss([ require('postcss-normalize')() ])

Customizable through browserlist

Allows customization of which parts of normalize.css to include by specifying browser versions in the browserlist. This helps in tailoring the normalization to only the necessary browsers, potentially reducing the CSS size.

postcss([ require('postcss-normalize')({ browsers: 'last 2 versions' }) ])

Other packages similar to postcss-normalize

sanitize.css

Similar to postcss-normalize, sanitize.css is a CSS library that provides consistent, cross-browser default styling for HTML elements. However, unlike postcss-normalize, it does not automatically adjust based on browserlist and must be included manually in your CSS.

modern-normalize

modern-normalize is another CSS reset library that normalizes styles for a wide range of elements. It is similar to postcss-normalize but does not integrate directly with PostCSS as a plugin and must be included separately in your project.

README

postcss-normalize

PostCSS plugin that that automatically applies the latest normalize.css

.foo {
  color: #fff;
}

/* Normalize styles here */

.foo {
  color: #fff;
}

--

Usage

postcss([ require('postcss-normalize') ])

See PostCSS docs for examples for your environment.

--

License

MIT © Sean King