Skip to Content

skiplink

Press tab to view the skip link. Skip to Content
html
Press
<kbd>tab</kbd>
to view the skip link.

<a
	class="button absolute -top-12 left-4 z-20 focus-visible:translate-y-16 motion-safe:transition-transform lg:left-56"
	href="#content"
>
	Skip to Content
</a>

Overview

Insert a skip link after the opening <body> tag to allow keyboard users to skip directly to the main content on the page. This is useful if you have a long navigation or other elements on the page before the content starts, otherwise keyboard users have to tab through all of theses items before reaching the main content.

In this example, the <a href="#content"> tag links to the <article id="content"> element on the page.