Practice
Gallery
Lab
Five gallery layouts built from native Image widgets, with lightbox and hover effects.
Style 1
Grid with lightbox
Click any image to open the lightbox. Practice: image link settings, columns and spacing.
Style 2
Masonry columns
Images keep their natural height in 3 columns (CSS). Practice: mixed aspect ratios.
Style 3
Hover overlay captions
Hover a card to reveal a caption. Practice: absolute positioning and hover CSS.
Project 2
Website design
Project 5
Website design
Project 9
Website design
Style 4
Mosaic with a featured tile
First tile spans two rows and columns. Practice: CSS grid classes.
Style 5
Before and after
Show a redesign result side by side.
BEFORE
AFTER