October 2026 - Skip Nav

We've added a Skip Nav utility and fixed Base UI installs for three utilities.

Skip Nav

A link that lets keyboard and screen reader users skip past repeated navigation to the main content (WCAG 2.4.1). It stays hidden until it receives keyboard focus. When focused, it uses z-index: 100 to stack above sticky headers and other z-50 layers.

pnpm dlx shadcn@latest add @diceui/skip-nav

Render it as the first focusable element and give your main content the exported MAIN_CONTENT_ID:

import { MAIN_CONTENT_ID, SkipNav } from "@/components/skip-nav";
 
<body>
  <SkipNav />
  <header>{/* Navigation */}</header>
  <main id={MAIN_CONTENT_ID}>{/* Page content */}</main>
</body>

On activation, focus moves to the target, not just the scroll position, so the next Tab continues from the main content. The URL hash doesn't change, so the skip doesn't add a history entry.

Read the docs

Base UI utilities

Hitbox, Pending, and Visually Hidden had Base UI docs but no Base UI registry entries, so installing them in a Base UI project failed. They now install for both bases.