Scroll Area
Custom-styled scroll container.
Import
tsx
import { ScrollArea } from "@cooud-ui/ui";
bash
npx cooud-ui add scroll-area
On this page
Custom-styled scroll container.
import { ScrollArea } from "@cooud-ui/ui";
npx cooud-ui add scroll-area
On this page
A fixed-height viewport with a styled, theme-aware vertical scrollbar.
const tags = Array.from({ length: 20 }, (_, index) => `v1.2.0-beta.${20 - index}`);<ScrollArea className="h-48 w-full max-w-xs rounded-xl border border-border-soft bg-surface-inset"><div className="flex flex-col gap-1 p-4">{tags.map((tag) => (<div key={tag} className="rounded-md px-2 py-1.5 font-mono text-sm text-fg-secondary">{tag}</div>))}</div><ScrollBar orientation="vertical" /></ScrollArea>