@csstools/normalize.css
Advanced tools
Package description
The @csstools/normalize.css npm package is a modern, HTML5-ready alternative to CSS resets. It normalizes styles for a wide range of elements and corrects bugs and common browser inconsistencies. It also improves usability with subtle improvements to the default styling of elements.
Preserves useful defaults
Rather than unsetting all styles, @csstools/normalize.css preserves useful defaults for elements, making it easier to start designing with a solid foundation.
import 'normalize.css';Normalizes styles for a wide range of HTML elements
It normalizes styles for a wide range of HTML elements, ensuring that elements render more consistently across different browsers.
import 'normalize.css';Corrects bugs and common browser inconsistencies
The package addresses various bugs and common browser inconsistencies that can affect the display of elements, providing a more uniform experience across different platforms.
import 'normalize.css';Improves usability
It includes styles that improve the usability of elements, such as making sure that tap targets are appropriately sized on mobile devices.
import 'normalize.css';Explains what code does using detailed comments
The CSS file within the package is well-commented, explaining what each style does and why it's included, which is helpful for developers to understand the purpose of the normalization.
import 'normalize.css';sanitize.css is another CSS library that normalizes styles across browsers. It takes a slightly different approach by also setting default styles for a range of elements, aiming to reduce the need for CSS resets.
reset-css is a package that provides a simple CSS reset to reduce browser inconsistencies in things like default line heights, margins, and font sizes of headings. It is more of a traditional reset compared to the normalization approach of @csstools/normalize.css.
modern-normalize is a smaller, more opinionated alternative to @csstools/normalize.css. It targets modern browsers only and provides normalization of styles with less overhead.
Readme
@csstools/normalize.css is a CSS library that provides consistent, cross-browser default styling of HTML elements.
<link href="https://unpkg.com/@csstools/normalize.css" rel="stylesheet" />
npm install @csstools/normalize.css --save
Import @csstools/normalize.css in CSS:
@import '~@csstools/normalize.css';
Alternatively, import @csstools/normalize.css in JS:
import '@csstools/normalize.css';
In webpack.config.js, use the appropriate loaders:
module.exports = {
module: {
rules: [
{
test: /\.css$/,
use: [ 'style-loader', 'css-loader' ]
}
]
}
}
Download
See https://csstools.github.io/normalize.css/latest/normalize.css
Please read the contribution guidelines in order to make the contribution process easy and effective for everyone involved.
necolas/normalize.cssNicolas Gallagher and I started writing normalize.css together. I named and created the normalize.css repository with the help of Paul Irish and Ben Alman. I transferred the repository to Nicolas, who turned it into a “household” CSS library.
Later, I resumed authorship of normalize.css with Luciano Battagliero. Together, we tagged, deprecated, and removed “opinionated” styles — styles developers often prefer but which do not fix bugs or “normalize” browser differences.
Later, Nicolas resumed authorship and the issue of whether to include or omit the opinionated styles forced us to split.
I continue working on the normalize.css project, currently under the “csstools” tag. I hope one day our differences are resolved and the projects are one again.
normalize.css is a project by Jonathan Neal, co-created with Nicolas Gallagher.
FAQs
A cross-browser CSS foundation
The npm package @csstools/normalize.css receives a total of 2,667,455 weekly downloads. As such, @csstools/normalize.css popularity was classified as popular.
We found that @csstools/normalize.css demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 3 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
UnitedHealth Group disclosed that the ransomware attack on Change Healthcare compromised protected health information for millions in the U.S., with estimated costs to the company expected to reach $1 billion.
Security News
GitHub is susceptible to a CDN flaw that allows attackers to host malware on any public repository.
Security News
At Node Congress, Socket CEO Feross Aboukhadijeh uncovers the darker aspects of open source, where applications that rely heavily on third-party dependencies can be exploited in supply chain attacks.