Scrollbars

Scrollbars allow user to scroll content within a window.

Scrollbar Example

Overview

The scrollbar is for both showing a user that content in a container overflows and for the user to control the scrolling content of that container. Always offer a scrollbar if an area has scrolling content: do not rely on auto-scrolling or on dragging. Scrollbars can be both vertical and horizontal. However, avoid horizontal scrolling, if possible.

Usage

Use when

  • An area has scrolling content.

Don’t use when

  • All the content is visible.
  • Horizontal scrolling can be replaced with a better option.
What's changed
Date Version Notes Contributors
01/16/2023 1.0.0 New component added. D. Bedick, E. Bohn, N. Cadsawan, E. Gunther, J. A. Provin Silva, L. Saenz, C. Starbird, R. Stillwell, S. Kaukonen, N. Byati
Last updated November 14, 2023.