Photo Gallery
An interactive photo gallery with rows of images that can be clicked to view in a modal. Features smooth layout animations and lazy loading for optimal performance.
POV: You had a great childhood
Install using CLI
npx shadcn@latest add "https://obsidianui.dev/r/photo-gallery.json"Install Manually
1
Install dependencies
2
Copy the source code
Copy into components/ui/photo-gallery.tsx
Note: Install via CLI for the full source code with Vignette, SelectedPhotoItem, and PhotoItem components.
Props
| Prop Name | Type | Default | Description |
|---|---|---|---|
| photos | Photo[] | [] | Array of photos with url and optional title |
| rows | number | 5 | Number of rows in the gallery |
| className | string | '' | Additional CSS classes |
| vignette | boolean | true | Show edge vignette effect |
| title | string | 'Gallery' | Gallery title |