Global scrollbar
Customizes the appearance of the browser scrollbar across your store.
Where to find it
- In your Shopify admin, go to Online Store → Themes → Customize
- Click the Theme settings (gear icon) in the left panel
- Click Global scrollbar
Settings
Appearance
| Setting | What it does | Options / Range | Default |
|---|---|---|---|
| Width | Sets the width of the scrollbar. | 4px – 20px (step 1) | 8px |
| Border radius | Rounds the corners of the scrollbar thumb and track. | 0px – 20px (step 1) | 4px |
Light mode
| Setting | What it does | Options / Range | Default |
|---|---|---|---|
| Thumb color | Sets the color of the draggable scrollbar thumb in light mode. | Color picker | #888888 |
| Track color | Sets the color of the scrollbar track behind the thumb in light mode. | Color picker | #f1f1f1 |
Dark mode
| Setting | What it does | Options / Range | Default |
|---|---|---|---|
| Thumb color | Sets the color of the draggable scrollbar thumb in dark mode. | Color picker | #666666 |
| Track color | Sets the color of the scrollbar track behind the thumb in dark mode. | Color picker | #2a2a2a |