Standard Navigation
Skip Links
The "skip to content" links keyboard and screen reader users expect as the first stop on a page, styled to match your brand instead of showing as an unstyled browser-default blue link when focused.
$ velocityx add standard-skip-linksBuilt for astro.
Needs a licence key —
subscribe here, then
velocityx loginonce.
Props
| Name | Type | Required | Default | Description |
|---|---|---|---|---|
| links | SkipLink[] | No | [{ href: '#main-content', label: 'Skip to main content' }] | |
| className | string | No | '' |
File this creates
The CLI writes this path into your project, relative to its root — nothing else moves.
components/velocity/standard-skip-links/StandardSkipLinks.astroUsing the Skip Links component
Install it with velocityx add standard-skip-links.
The CLI writes the source straight into your project — no runtime dependency, no registry
lock-in, and it themes itself from the same primary-*/accent-* scale as the rest of the library.
Related components
More from Standard Navigation.
End-of-page block of onward destinations — a heading and a responsive grid of fully-clickable cards, each with a short description and a hover arrow. Static markup, no client JS, built for "related articles" and "keep exploring" footers.
astroIn-page section links that highlight themselves as the reader scrolls, so a long docs or landing page always shows where you are without you having to hunt for it. Tracks visibility with IntersectionObserver, never a scroll handler, so it costs nothing on long pages.
reactA 'waffle' product switcher popover for suites that have grown past one nav bar into several standalone apps — a grid of icon tiles for every section, the current one marked, fully arrow-key navigable and closes cleanly on outside click or route change.
reactHeader for a drill-down screen: a real back link to the parent (not a history hack), the page title and optional subtitle, and an overflow menu for secondary actions that don't need a permanent button.
react