rembrembdocs

scroll-behavior

Utilities for controlling the scroll behavior of an element.

ClassStyles
scroll-auto
scroll-behavior: auto;

| | scroll-smooth |

scroll-behavior: smooth;

|

Use the scroll-smooth utility to enable smooth scrolling within an element:

<html class="scroll-smooth">  <!-- ... --></html>

Setting the scroll-behavior only affects scroll events that are triggered by the browser.

Use the scroll-auto utility to revert to the default browser behavior for scrolling:

<html class="scroll-smooth md:scroll-auto">  <!-- ... --></html>

On this page

[

Refactoring UI

From the creators of Tailwind CSS

Make your ideas look awesome, without relying on a designer.

“This is the survival kit I wish I had when I started building apps.”

Derrick Reimer, SavvyCal

](https://www.refactoringui.com/?ref=sidebar)

Copyright © 2026 Tailwind Labs Inc.·Trademark Policy