Scroll Area

A custom-styled scrollable region, built on the Base UI `ScrollArea` primitive.

A custom-styled scrollable region, built on the Base UI ScrollArea primitive.

Item 1 — scroll to see more content in this region.

Item 2 — scroll to see more content in this region.

Item 3 — scroll to see more content in this region.

Item 4 — scroll to see more content in this region.

Item 5 — scroll to see more content in this region.

Item 6 — scroll to see more content in this region.

Item 7 — scroll to see more content in this region.

Item 8 — scroll to see more content in this region.

Item 9 — scroll to see more content in this region.

Item 10 — scroll to see more content in this region.

tsx

React / JSX

import { ScrollArea } from "@celestia-project/ui/primitive/scroll-area"
<ScrollArea className="h-36 rounded-md border p-4">  {/* long content */}</ScrollArea>

ScrollBar with orientation="horizontal" adds a horizontal scrollbar.

PreviousResizable

NextSelect