Animated scroll without JS

When you have a one page site, you may want to have a smooth scroll to anchor links. This is a common pattern in sites, and it's easy to do with CSS.

You need three elements for this to work:

• A link with an href attribute pointing to an element with an id attribute using #.
• The element with the id attribute (make sure it’s the same as the href value without the #).
• The css snippet below.

html {
  scroll-behavior: smooth;
}

No scrollIntoView or any JS needed! 🎉