modern-normalize

modern-normalize is a small CSS stylesheet by Sindre Sorhus that fixes cross-browser inconsistencies in default HTML element styling. It is a spiritual successor to necolas/normalize.css, but deliberately narrower in scope: instead of trying to smooth over quirks across every browser ever shipped, it targets only the latest versions of Chrome, Firefox, and Safari, which lets the file stay small while still being fully tested and actively maintained.

The stylesheet applies a handful of opinionated defaults on top of the normalizations — most notably box-sizing: border-box on all elements and a more readable default tab size — then corrects browser-specific quirks in typography, form controls, tables, and interactive elements like <summary>. Because it ships as a single plain CSS file with no build step or JS dependency, it drops into any project via npm install and an @import, a <link> tag, or a CDN URL (jsDelivr, unpkg, cdnjs).

What You Get

• A single ~3.4KB CSS file with no build step, preprocessor, or JavaScript required
• Opinionated box-sizing: border-box applied globally for predictable layout sizing
• Consistent default font stacks and font-size handling across Chrome, Firefox, and Safari
• Form control normalization (margins, appearance, padding) for buttons, inputs, and fieldsets
• A readable default tab-size and corrected <sub>/<sup>/<small> typography
• Distribution via npm, jsDelivr, unpkg, and cdnjs for drop-in use in any stack

Common Use Cases

• Establishing a consistent style baseline at the start of a new web project
• Replacing a heavier normalize.css or reset.css dependency in a modern-browser-only app
• Pairing with a CSS framework or design system that expects box-sizing: border-box globally
• Quick-including via CDN <link> tag for static sites and prototypes with no build tooling
• Providing a neutral, predictable starting point before applying Tailwind or custom component styles

Under The Hood

Architecture The project’s entire runtime surface is a single generated CSS file, modern-normalize.css, organized into clearly commented sections (Document, Sections, Text-level semantics, Tabular data, Forms, Interactive) that mirror the structure of the original normalize.css it descends from. There is no runtime logic, module graph, or execution path to trace — the “architecture” is the authoring and verification pipeline around that one file: a package.json version script rewrites the embedded version banner and stages the change on every release, and the file is the sole entry (main/style fields both point to it).

Tech Stack The repo itself is TypeScript-majority only because its test suite is written in TypeScript (via TestCafe); the shipped artifact is plain CSS with zero runtime dependencies. Tooling is entirely devDependencies: Stylelint with stylelint-config-xo lints the CSS itself, http-server serves static fixtures for browser tests, replace-in-files-cli bumps the version banner, and testcafe drives real-browser acceptance tests. CI (GitHub Actions) runs on macOS across two Node LTS lines and executes npm test, which currently runs the Stylelint check.

Code Quality Code quality here means CSS correctness rather than application logic: linting is enforced via Stylelint, and cross-browser behavior is verified with TestCafe acceptance tests for Chrome, Firefox, and Safari under test/acceptance/, each asserting computed style properties (box-sizing, font stacks, margins, tab-size, etc.) against two static fixture pages. A few pseudo-element assertions are explicitly stubbed out with TODO comments because TestCafe can’t select pseudo-elements, and the maintainers note this rather than silently skip it. There are no traditional unit tests since there is no application code to unit test.

What Makes It Unique The project’s differentiator is scope reduction as a design decision: rather than trying to normalize every browser in history the way normalize.css does, it explicitly drops support for anything but the latest evergreen browsers, letting the stylesheet shrink and stay simple. The README states the project’s own goal is to make itself obsolete as browsers converge further — an unusually explicit statement of intent for a widely-used dependency, and one that keeps the maintenance burden and file size deliberately small compared to more exhaustive resets.