Coverflow 38 block design & features
Coverflow38 is an ascending staircase carousel built with shadcn/ui for a travel poster shop. Twelve portrait prints stand on steps that climb from the lower left to the upper right, each one smaller and set further back than the last, with a thin tread line and a soft floor shadow under every card. The selected print sits full size on the bottom step, and its title, place and price sit in the open space below the stair alongside a segmented progress bar, arrow buttons, a pause button and a mono counter.
The stair autoplays and climbs one step at a time, with each progress segment filling before the next print slides down onto the bottom step and the title swaps with a short blur. The loop never ends: the print that leaves fades out past the bottom step, a new one fades in at the top, and clicking a card or segment always takes the shorter way round. Autoplay pauses while the stair is hovered or focused, and the pause button stops it entirely. Arrow keys step through the prints, and dragging down and to the left along the diagonal pulls the stair forward before it settles on the nearest step. With reduced motion turned on, autoplay starts paused and steps move without the spring.
The layout suits print shops, galleries and travel brands that sell a run of illustrated or photographic posters. Each poster needs a portrait image, a title, a place and a price, and the interval can be changed with a prop.