Scroll to Top

Need a scroll to top button?

Tips

Here are some tips on a best implementation;

Use an inline SVG, e.g. from Relume that accepts currentcolor, to keep it very easy to style on your site.

https://icons.relume.io/collection/all?s=top

Handle the scroll to top using script to ensure it is a smooth scroll.

Place it in your footer component so that it is site-wide.

If you want it to fade in so that it is not visible above the fold, use script for that also to avoid needing a page-interaction, which must be copied to every page manually.

Code

If your ID is scrollToTopBtn;

Here's some code as a starting point, which handles both the scrolling and the fade-In;

‍

‍