Scroll Area (Base UI)

Scroll container with a restyled overlay scrollbar that stays discoverable on hover and follows the shape system. Falls back to native overflow scrolling on touch-primary devices. Base UI flavor; adapted from Lina (https://lina.sameer.sh).

Library

Fluid Functionalism

Framework

React

Type

ui

License

MIT

Dependencies

@base-ui/react@^1.9.0

Install

npx shadcn@latest add @fluid/scroll-area-base

Files

• registry/base/scroll-area.tsx
• registry/default/lib/utils.ts
• registry/default/lib/shape-context.tsx
• registry/default/hooks/use-touch-primary.tsx
• lib/utils.ts
• lib/shape-context.tsx
• hooks/use-touch-primary.ts

Source

https://github.com/mickadesign/fluid-functionalism

Categories

• Layout Components
• React Layout Components
• Tailwind CSS Layout Components
• Scroll Area Components
• Tailwind CSS Scroll Area Components

More from Fluid Functionalism

• Scroll Area
• Accordion
• Accordion (Base UI)
• Ask User Questions
• Badge
• Banner
• Breadcrumb
• Button
• Button (Base UI)
• Calendar
• Card
• Carousel Dots