About Smart Media Lightbox
Smart Media Lightbox
A flexible image and video component for Framer that creates a polished, responsive viewing experience—with the flexibility to use it as a single lightbox or a connected gallery.
Display beautiful media with fullscreen viewing, zoom and pan interactions, responsive overlays, and optional gallery navigation. Use each component independently for a single-media lightbox, or assign the same group name to multiple components to create a seamless navigable gallery.
Key Features
Single or Grouped Lightbox — Use one component as an independent lightbox, or connect multiple components into a gallery using a shared group name.
Image & Video Support — Display responsive images or videos with poster/fallback images.
Fullscreen Lightbox — Open media in an immersive fullscreen viewer with smooth animations.
Zoom & Pan — Zoom up to 8× and drag around the media when zoomed in.
Gallery Navigation — Grouped media supports previous/next navigation and thumbnail previews.
Responsive Overlays — Configure different overlay content for desktop, tablet, and mobile.
Video Optimization — Videos automatically play when visible and pause when outside the viewport.
Accessible Media — Includes configurable alt text, keyboard interaction, and semantic controls.
Single Lightbox
Perfect for a hero image, project preview, product image, or featured media. Simply enable the lightbox without assigning a group.
Grouped Gallery
Create a complete gallery by giving multiple components the same Lightbox Group name. Visitors can then open any image and navigate through the entire collection using arrows or thumbnails.
Perfect For
Portfolio galleries, architecture websites, photography portfolios, product showcases, real estate projects, agency websites, case studies, editorial layouts, and project presentations.
Use it as a simple single lightbox or build a fully connected media gallery—all from one Framer component.
