Preflight

Base Styles: Preflight

@import "tailwindcss"; also injects Preflight, a base stylesheet built on modern-normalize 7,419 (https://github.com/sindresorhus/modern-normalize 7,419 ), into the base cascade layer. Where a normalize-style reset only smooths over browser differences, Preflight removes user-agent styling altogether: an <h1> renders at body size, a <ul> has no bullets and a <button> looks like plain text until you add utilities. Every visible size, margin and color then comes from your classes and theme, never from browser defaults that are not on your scale.

The main Preflight resets (all boxes also get box-sizing: border-box)
Selector Preflight rule Why
*, ::before, ::after No margin, padding; border: 0 solid border draws 1px
h1-h6, a Size, weight, color inherited Styling is opt-in
ol, ul, menu list-style: none Bullets need list-disc
img, svg, video... Block, max-width: 100% No gap or overflow
Form controls Inherit font, clear background Match nearby text
[hidden] display: none !important flex cannot unhide it

Add your own defaults inside @layer base { h1 { font-size: var(--text-2xl); } }; utilities still win because the utilities layer comes later. To drop Preflight, for example when adding Tailwind 5,202 to a site that has its own reset, replace @import "tailwindcss"; with the parts you want:

Importing Tailwind without PreflightSass
@layer theme, base, components, utilities;
@import "tailwindcss/theme.css" layer(theme);
@import "tailwindcss/utilities.css" layer(utilities);