Scroll Fade
Indicate overflowing content with a fade.
Use ScrollFade when scrollable content should fade to indicate more content instead of showing a
native scrollbar. When the browser does not support the fade, the native scrollbar remains visible.
Read Layout to choose a layout component.
Block axis
Pass axis="block" to scroll on the block axis. The default axis="inline" scrolls on the inline
axis. Both values follow the element's writing mode.
Accessibility
Pass exactly one of aria-label or aria-labelledby.
When content overflows, ScrollFade becomes a focusable, named region with a focus-visible treatment.
When the content fits, ScrollFade has no region role, accessible-name attribute, or extra tab stop.
ScrollFade always renders a div. Compose semantic structure around or inside it.
API
ScrollFadeProps also accepts compatible DOM and ARIA attributes and event handlers for its rendered element.
Prop
Type