Carousel Slider
A hero with a sliding carousel of images behind a headline and short intro. Use it to cycle through signature work the moment a portfolio loads.
A hero with a sliding carousel of images behind a headline and short intro. Use it to cycle through signature work the moment a portfolio loads.
Search blocks by description or jump to a page.
Carousel Slider is a full viewport hero with a rotating background image behind anchored copy. Three slides cycle automatically every five seconds, each one covering the entire viewport with a full bleed photograph and a gradient overlay that fades from transparent at the top to deep black at the bottom. Anchored to the lower left over that gradient sits the active slide's content: a pill badge naming the category, a large heading, a short description line, a primary call to action button, and a paired prev/next icon pair with a numeric position counter.
The slides array and every string inside it are plain data, so you can swap the images, rewrite the badge labels, headings, and descriptions, or add and remove slides without touching the layout code. The call to action button label and the autoplay interval are equally easy to adjust. The navigation controls and position counter are always rendered and require no configuration.
Reach for this block when the hero needs to carry several distinct categories of work at once and a single static image would leave the rest unrepresented. It suits a real estate marketplace landing page well: each slide can feature a different property type, neighborhood, or listing tier, cycling them in front of visitors before they scroll. The full viewport image draws immediate attention to the visual quality of the listings, and the badge makes the category legible at a glance. For pages that only have one story to tell, the Split Layout or Full Screen Centered hero keeps the messaging tighter.
A natural flow around it on a Portfolio page:
Before
After
Each slide is an independent record, so the content can shift per slide while the layout stays fixed. A few ways to use that flexibility:
Tip: use high contrast photography where the subject is brightest near the top of the frame so the bottom gradient does not obscure faces or key details.