Promo Banner 10 block design & features
This promo banner is a rounded two-column panel. A square product photo fills the left column, and a flat colour panel on the right carries one offer at a time: a large headline, a short line of detail and an underlined link, with previous and next buttons and a position count at the bottom. It is built with shadcn/ui.
The offers rotate on a timer. The headline rolls up out of view as the next one rolls in from below, the photo crossfades to the matching product and the panel colour shifts from amber to sky to rose. The previous and next buttons step through the offers in either direction with the roll following the direction, and the rotation pauses while the pointer or keyboard focus is on the banner.
It is a bright, flat and type-led design with no gradients or overlays. The offers, each with a heading, description, link, colour classes and image, and the interval are props. With reduced motion the rotation stops and the buttons switch offers without animation.