Media Gallery
Advanced media gallery component with multiple layouts, category filtering, sorting, and lightbox integration. Perfect for portfolios, photo galleries, and media showcases with responsive design and smooth animations.
Pro features
What the Pro version adds to this component.
Multiple Layouts
Grid, masonry, horizontal scroll, and justified layouts
Filtering & Sorting
Category filters with configurable sort options and a default selection
Lightbox Integration
Built-in lightbox with zoom, keyboard navigation, and a thumbnail strip
Responsive Design
Fully responsive with customizable breakpoints
Smooth Animations
Framer Motion powered transitions and interactions
Lazy Load & Infinite Scroll
IntersectionObserver-based lazy image loading with optional infinite-scroll pagination
Installation
Install via CLI
npx @moontra/moonui-cli add media-galleryUsage
Mountain Vista
Beautiful mountain landscape with morning fog
Ocean Waves
Peaceful ocean waves during sunset
Modern Building
Contemporary building design in the city
Portrait Session
Professional portrait photography
Golden Hour
Stunning sunrise over the valley
Forest Trail
Peaceful path through autumn forest
Reading Corner
Cozy reading corner with coffee
Work Space
Clean and modern workspace setup
Urban Skyline
City lights at twilight
Examples
Basic Grid Gallery
Standard grid layout with category filtering and sorting enabled
Masonry Layout
Pinterest-style masonry layout for varied image sizes
Horizontal Scroll
Horizontal scrolling gallery perfect for carousels and timelines
Portfolio Showcase
Professional portfolio gallery with detailed metadata and sorting