A scrollable container with custom, styled scrollbars built on Base UI.
"use client"; import { ScrollArea } from "@/components/ui/scroll-area"; export default function Default() { return ( <div className="flex min-h-screen w-full items-center justify-center bg-background p-8"> <ScrollArea className="h-72 w-[360px] rounded-xl border bg-card p-5 text-base shadow-sm"> {Array.from({ length: 20 }).map((_, i) => ( <p key={i} className="border-b py-3 last:border-b-0">Row {i + 1}</p> ))} </ScrollArea> </div> ); }