Masonry
An image wall packed into the shortest column. It reflows smoothly on resize and items rise in one after another on first view.
import { Masonry } from "pleate/effects/masonry";Gallery
Props
- items
ratio is height over width.
{ id, src, alt, ratio, href? }[]- breakpoints
Columns by container width.
[minWidth, columns][]default 900:4, 600:3, 0:2- gap
Gap (px).
numberdefault 12- stagger
Delay between items (s).
numberdefault 0.05
Accessibility
- Items with href are links; the rest are figures with alt text.
- Reduced motion places everything at once.