1. Home
  2. Experiments
  3. UI
  4. Scroll Area

Scroll Area

Scroll areas are useful when showing tall content

Tempor ex eiusmod sit. Pariatur Lorem nostrud ut dolore nisi mollit. Sit Lorem in ad incididunt Lorem elit in commodo non ullamco ut. Laboris irure in excepteur cupidatat ad id pariatur officia qui nostrud commodo dolor adipisicing. Eu ad aute laboris esse non ea reprehenderit tempor sint ea. Quis ad enim duis incididunt veniam ullamco eiusmod irure fugiat. Duis est esse exercitation adipisicing deserunt labore nostrud amet ullamco ex veniam laborum velit nulla non. Consectetur laboris tempor aliquip dolor consectetur voluptate non est consequat ipsum id nisi. Ut consequat veniam sint voluptate. Amet officia cupidatat in anim enim laborum aliquip quis aute non et. Tempor ea aute esse irure laborum. Culpa irure est ipsum ex magna. Excepteur quis do adipisicing aute elit esse id ipsum. Occaecat et veniam reprehenderit qui veniam nisi id. Incididunt laboris sit labore sint cupidatat. Veniam pariatur et incididunt deserunt non minim et ea enim elit exercitation eu magna. Laborum laboris ad sint cillum minim. Duis dolor consectetur qui aliquip ullamco ipsum.

Installation

bunx shadcn@latest add https://maxwiseman.io/experiments/ui/scroll-area/json

Additions

This component features the new scrollShadow prop. The prop accepts values "top", "bottom", "y", and undefined. This prop will add a shadow to the top, bottom, or both of the scrollable area as seen in the example above.