SkipLink
A link past the nav to the main content. It stays hidden until it has the keyboard focus.
When to use
Section titled “When to use”On every page, first in the <body>.
On a page
Section titled “On a page”<body> <SkipLink /> <TopNav … /> <main id="main">…</main></body>href defaults to #main; give the main content that id.
Anatomy
Section titled “Anatomy”A canvas pill with a hairline at the top left, over the nav, with the focus ring around it.
Accessibility
Section titled “Accessibility”It meets WCAG 2.4.1, Bypass Blocks: without it a keyboard reader tabs through every nav link on every page before reaching the text.
SkipLink.astro. The handoff has no skip link; this one is drawn from its focus ring and canvas pill.