Scroll
Horizontal scroll
A section that pins in place and turns your vertical scroll into sideways travel.
Paste it into ChatGPT, Claude, Cursor or v0.
Usage
import { HorizontalScroll } from '@vizzele/react';
<HorizontalScroll label="Case studies">
{projects.map((p) => <ProjectCard key={p.id} {...p} />)}
</HorizontalScroll>Props
| Prop | Type | Default | Description |
|---|---|---|---|
children | ReactNode | — | Track items. |
label | string | — | Region name. |
container | HTMLElement | Window | window | Scroll root. |
--vz-hscroll-gap / -pad | CSS length | — | Spacing. |
Accessibility
- Content stays in DOM order, so keyboard and screen readers read it normally.
- Exposes --vz-progress for progress indicators.