Waiting for action
Copy this complete component into a page file. Edit and run it in the Playground.
Loading editor…
Accessible custom scrollbar with visual tracks and draggable thumbs while retaining native scrolling behaviour.
| Prop | Type | Default | Description |
|---|---|---|---|
orientation | `"vertical" | "horizontal" | "both"` |
maxHeight | `number | string` | — |
autoHide | boolean | true | Hides tracks until scrolling begins. |
thickness | number | 10 | Track thickness in pixels. |
minThumbSize | number | 28 | Minimum draggable thumb size. |
verticalTrackShape | `"round" | "square"` | "round" |
verticalThumbShape | `"round" | "square"` | "round" |
horizontalTrackShape | `"round" | "square"` | "round" |
horizontalThumbShape | `"round" | "square"` | "round" |
role="scrollbar", orientation, current value, and keyboard controls.