Ecommerce Hero 4 block design & features
This ecommerce hero fills the viewport with large interior photography. Each collection, Living room, Lounge and Workspace, has its own photo, heading, description and shop button. The photos crossfade on a timer while the current one drifts in a very slow horizontal pan. It is built with shadcn/ui.
The text sits on a solid card in the bottom corner, so it stays legible over any photo. At the foot of the card a row of collection tabs shows a thin progress line that fills while each collection is on screen; clicking a tab jumps straight to that collection and restarts the timer.
The collections, with their labels, copy, links and images, and the interval between them are props. With reduced motion the slideshow stops advancing, the pan is switched off and the tabs still change collection on click.