# Smooth Scrolling for Anchor Links

> Makes in-page anchor links scroll smoothly instead of jumping, while respecting visitors who prefer reduced motion.

- Type: CSS
- Runs: Site-wide header
- Category: [Frontend & Design](https://wpide.com/library/category/frontend/)
- Tags: css, scrolling, ux
- Author: WPIDE Team
- Installs: 0
- Updated: 2026-10-28
- Page: https://wpide.com/library/smooth-scrolling/

## Code

```css
html {
    scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }
}
```

## How to use it

Install the free WPIDE plugin (https://wordpress.org/plugins/wpide/), find "Smooth Scrolling for Anchor Links" in its snippet library and add it in one click; or create a new CSS snippet in WPIDE (or any code snippets plugin) and paste the code above. More snippets: https://wpide.com/library/