Skip Link

Use the skip link component to help keyboard-only users skip to the main content on a page.

Example

The skip link is already implemented at the top of every page in this demo application. Press the Tab key when the page loads to see it appear at the top of the page.

The skip link component allows keyboard users to skip directly to the main content, bypassing navigation and other repeated elements. This is particularly helpful for users who navigate using a keyboard or screen reader.

How it works

1. The skip link is visually hidden until it receives keyboard focus
2. When a keyboard user presses Tab, the skip link appears
3. Pressing Enter activates the link and moves focus to the main content

Try it yourself

Go to the home page and press Tab when it loads to see the skip link in action.