Scrollbars

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.
• Allow users to easily navigate through the content without having to zoom in and out or swipe.
• If a touchscreen does not support gestures or the bar needs to be clearly visible, use button scrolling.

Don’t use when

• All the content is visible.
• Horizontal scrolling can be replaced with a better option.