Gallery 17 block design & features
The section centers a Shadcn UI Carousel at a maximum width of 50rem with visible overflow so that adjacent slides remain partially visible. Each slide holds a 4:3 image inside a rounded container. The active slide displays at full scale and opacity, while inactive slides scale down to 70% and drop to 40% opacity, all transitioning over 300ms.
Large default-variant CarouselPrevious and CarouselNext buttons are positioned well outside the carousel edges on desktop, sized at 3.5rem. Below the carousel, a row of clickable dot indicators highlights the current slide with a filled circle and renders the rest at low opacity.
The look is gallery-minimal, removing all text and chrome to let the images dominate. The scale-and-fade treatment on off-screen slides creates a natural depth-of-field effect that draws attention to the center.
On smaller screens the navigation arrows hide and the dots become the primary navigation mechanism alongside swipe gestures.
