Gallery Depth
A dimensional image field that resolves from deep perspective as the viewer scrolls.
HorizonX ScrollCollection
Web Image Galleries & Photo Grid Layouts
Web image gallery layouts with scroll-driven stacks, fans and depth, plus coded ring, coverflow, arc and time-stack showcases. Use a gallery when images are the content: project work, a product series or an editorial sequence. Match the layout to whether visitors compare items or follow a story.
- 23 designs
- Made by the HorizonX team
- Read the guide
HorizonX Scroll
What is inside
Web image gallery layouts with scroll-driven stacks, fans and depth, plus coded ring, coverflow, arc and time-stack showcases.
When to use it
Use a gallery when images are the content: project work, a product series or an editorial sequence. Match the layout to whether visitors compare items or follow a story.
Customize and integrate
Prepare images with consistent crops and useful alternative text. Check whether your chosen item is a project source or an editor, then inspect its available export format.
Before publishing
Load appropriately sized images rather than full-resolution originals. Keep important captions reachable without hover and test the sequence with touch and keyboard input.
How is this different from the carousel collection?
This page focuses on image showcases and scroll galleries, including coded gallery projects. The carousel hub also covers slider-style components.
Should images share an aspect ratio?
Consistent crops make comparison easier. If the layout uses mixed proportions, test your own images rather than relying on its preview artwork.
Can a gallery work on mobile?
Test the selected layout with narrow screens and touch. Provide a straightforward way to reach images and captions without pointer-only interactions.
From the blog
Guides
Keep exploring
Related collections
Find the next design for your project
Browse every design in the HorizonX catalog, from UI kits and templates to textures, shaders and mockups.