Layout/Scroll Area

Scroll Area

A scrollable container with thin, subtly-styled scrollbars in place of the native browser scrollbar. Supports vertical, horizontal, or both-axis overflow.

import { ScrollArea } from "@animui/ui"

Vertical

  • List item 1
  • List item 2
  • List item 3
  • List item 4
  • List item 5
  • List item 6
  • List item 7
  • List item 8
  • List item 9
  • List item 10
  • List item 11
  • List item 12

Horizontal

Card 1
Card 2
Card 3
Card 4
Card 5
Card 6
Card 7
Card 8

Props

PropTypeDefaultDescription
childrenReact.ReactNodeScrollable content.
maxHeightstring | numberApplied as an inline max-height style to constrain vertical scrolling.
orientation"vertical" | "horizontal" | "both""vertical"Controls which axis is scrollable.
classNamestringAdditional classes for the scroll container.

Accessibility

  • Uses native scroll behavior, so keyboard scrolling and screen reader navigation work as expected.
  • Scrollbar styling is purely cosmetic and falls back to the browser default in unsupported browsers.
© 2026 Steal Shadow. MIT License.Report an issue