Containers

ScrollArea

A scrolling region with a styled scrollbar that matches the app on every platform.

Importimport { ScrollArea } from "@/components/ui/ScrollArea";
Sourcesrc/components/ui/ScrollArea

A scrolling region with a scrollbar that looks the same on every platform — macOS hides native overlay scrollbars until you scroll, which reads as “this does not scroll”. Use it where the fact that content continues is itself information.

Vertical

The height comes from your own class — ScrollArea does not impose one, and without a height it will not scroll.

Item 1
Item 2
Item 3
Item 4
Item 5
Item 6
Item 7
Item 8
Item 9
Item 10
Item 11
Item 12
Item 13
Item 14

Props

ScrollArea

PropTypeDefaultDescription
…HTMLAttributesHTMLAttributes<HTMLDivElement>—Give it a height via `className` or `style`, or it will not scroll.

ScrollBar

PropTypeDefaultDescription
orientation"vertical" | "horizontal""vertical"Rendered by ScrollArea; only needed when composing manually.