Blanksheet

A principled CSS reset — eliminates implicit defaults, preserves text semantics, skips what you'll override anyway.

Principles

1. Eliminate implicit layout — zero margin, padding, vertical-align. Purely spatial properties only.
2. Preserve text semantics — keep any UA style that visually conveys meaning (<strong> bold, <em> italic, <a> color/underline, <del> strikethrough, heading weight, <code> monospace).
3. Skip what developers always override — heading font-size, border, background, dialog visuals, ::backdrop. Elements always replaced with custom components (<meter>, <progress>, specialized inputs) are also skipped.
4. Apply real-world universal defaults — list-style: none, border-collapse, form font: inherit, box-sizing: border-box, number spinner removal.
5. Normalize cross-browser inconsistencies — sub/sup line-height, WebKit search appearance, Firefox ::-moz-focus-inner, mobile text-size-adjust, ::placeholder opacity, Firefox :-moz-ui-invalid, Safari summary marker.

No opinions (cursor: pointer, font-smoothing). No !important. No structural elements (div, span, section).

How It Works

All rules live inside @layer reset — the lowest cascade priority. Any unlayered style wins automatically, regardless of specificity or source order.

@layer reset {
  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    margin: 0;
    /* font-weight: kept (text semantics); font-size: skipped (always overridden) */
  }
}

Chrome 99+, Firefox 97+, Safari 15.4+.

Safari < 18.4 does not support list-style: none on <summary> and renders the disclosure triangle via a proprietary ::-webkit-details-marker pseudo-element. A workaround is included and will be removed when Safari < 18.4 drops below 1% global share.

Usage

CDN

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/blanksheet" />

npm

npm install blanksheet

@import "blanksheet";

License

MIT