Css on top of page

Perhaps the easiest way to offer that to the user is a link that targets an ID on the element. So like

Jump to top of page

But weve got a few options here.

If you want it to smooth scroll up to the top, you can do that in CSS if you like:

html { scroll-behavior: smooth; }

Note that placing a property on the HTML element like that is all-encompassing behavior you dont have much control over.

In this case, we arent linking to a focusable element either, which means that focus wont change. Thats probably important, so this would be better:

Jump to top of page

Its better because the focus will move to that anchor tag, which is good for people using the keyboard or assistive technology.

These require clicks though. You might need to trigger scrolling within JavaScript, in which case:

window.scrollTo[0, 0];

is a sure bet to scroll the window [or any other element] back to the top. The scrolling behavior of that is determined by CSS as well, but if you arent doing that, you can force the smoothness in JavaScript:

window.scroll[{ top: 0, left: 0, behavior: 'smooth' }];

For a more complete story about smooth scrolling, we have a page for that.