COMPONENTS
Scroll to top
A labelled native link returns to a page-owned top anchor. One structural class; no JavaScript.
Usage
Markup: a.scroll-top with href pointing to an existing top ID
Behaviour: Native fragment navigation. No scroll observer, automatic hiding or JavaScript.
- Included in complete and scoped builds. Modular consumers load tokens, base, reva.scroll-top.css and reva.scrolling.css.
- Put a unique ID at the beginning of your page and link to it. Keep a visible label; decorative arrows are aria-hidden.
- The link is in normal flow by default. It stays available without a scroll timeline or observer and is hidden in print.
- Document scrolling follows data-motion on html. Local motion on the link alone cannot change the viewport scroll container.
- For a floating link, application CSS can set position:fixed and physical safe-area offsets. Reserve enough space so it cannot cover content, controls or focused elements.
Component API and styling module · Inherited appearance settings
Footer return link
This example links to the top of this documentation page.