Gallery 6 - Gallery carousel that loops back to the start

Free

Horizontal image carousel with a heading, call-to-action link, and arrow controls that rewind to the first card after the last.

Shadcn Gallery 6 block

Component data

ID
gallery6
Access
free
Created
Aug 5, 2024
Updated
Oct 9, 2026
Type
block
Libraries
Radix UI, Base UI, React Aria
Figma

Gallery 6 block design & features

The header area contains a semibold heading on the left with a "Book a demo" link featuring an ArrowUpRight icon, and outline-variant arrow buttons on the right. Below, a shadcn/ui Carousel renders slides that overflow beyond the container on wide viewports, giving the track a full-bleed feel while keeping the header text contained.

Each slide displays a 3:2 aspect image that scales up on hover, a title in medium-weight type, a two-line summary in muted foreground text, and a "Read more" link with an animated arrow. The cards have no visible background surface, relying on the image and text alone. On mobile the carousel enables drag-free scrolling. The arrows never disable: next on the last card scrolls back to the first, and previous on the first jumps to the end.

The style is open and airy, with generous spacing between slides and no card borders or backgrounds enclosing the content. The result is a lightweight browsing layout that foregrounds imagery and keeps navigational chrome to a minimum.