Scroll Area

A headless custom scroll area primitive that replaces native scrollbars with styleable alternatives while maintaining accessibility.

Vertical Scroll

A vertical scroll area with a long list of items in a fixed-height container. The native scrollbar is hidden and replaced with a custom styleable scrollbar.
Loading example…

Horizontal Scroll

A horizontal scroll area for wide content such as a row of cards or tags.
Loading example…

Both Orientations

A scroll area that supports both vertical and horizontal scrolling. Set Orientation to ScrollAreaOrientation.Both and include two BbScrollAreaScrollbar components.
Loading example…

Data Attributes

Use these data attributes for CSS styling:

  • [data-orientation="vertical"] - On scrollbar when vertical
  • [data-orientation="horizontal"] - On scrollbar when horizontal