You know that annoying thing where you jump to an anchor and the site’s sticky header covers it up?

.heading {
  scroll-margin-top: 72px;
}

In Tailwind, use a scroll-mt-* utility:

<h2 id="section" class="scroll-mt-16">Section heading</h2>

Or use an arbitrary value to match your header height exactly:

<h2 id="section" class="scroll-mt-[72px]">Section heading</h2>

Browser support: Works natively in Chrome, FF, Edge, Opera. Supported in Safari, but with a non-standard property, scroll-snap-margin-top.