---
title: "Framer CMS Gallery, Carousel &amp; Lightbox Components | FramerHub"
canonical_url: "https://framerhub.io/components/category/cms-galleries"
last_updated: "2026-10-24T15:55:31.672Z"
meta:
  description: "Components that fill gaps in Framer's CMS: masonry galleries and lightboxes from a CMS gallery field, a full carousel, auto table of contents, breadcrumbs and reading time."
  "og:description": "Components that fill gaps in Framer's CMS: masonry galleries and lightboxes from a CMS gallery field, a full carousel, auto table of contents, breadcrumbs and reading time."
  "og:title": "Framer CMS Gallery, Carousel & Lightbox Components | FramerHub"
---

FramerHub home

# **Framer CMS, Gallery & Carousel Components**

Components that fill gaps in Framer's CMS: galleries and lightboxes that read a CMS gallery field, a full-featured carousel, an automatic table of contents, SEO breadcrumbs and reading time.

11 components, 1 free.

[<h3>**Infinite Gallery**</h3>An infinitely scrolling horizontal gallery with snapping physics and a smooth parallax effect.**Gallery****Parallax****Infinite**](https://framerhub.io/components/infinite-gallery) [<h3>**CMS Gallery Lightbox**</h3>A powerful CMS masonry gallery with native GLightbox support, responsive extraction, and interactive hover effects.**Masonry****Slider****Grid**](https://framerhub.io/components/cms-gallery-lightbox) [<h3>**CMS Gallery Popup**</h3>A fully customizable CMS Gallery Popup with thumbnail navigation and seamless interactions.**light box****popup****slider**](https://framerhub.io/components/cms-gallery-popup) [<h3>**AutoTOC**</h3>Auto-generated table of contents that tracks scroll position.**TOC****Navigation****Sticky**](https://framerhub.io/components/auto-toc) [<h3>**Image Tiles Menu**</h3>An interactive menu that reveals a dynamic grid of image tiles on hover.**Menu****Hover Effect****Image Grid**](https://framerhub.io/components/image-tiles-menu) [<h3>**Smart Breadcrumbs**</h3>SEO-optimized breadcrumbs with automatic schema injection and flexible styling.**Breadcrumbs****CMS****SEO**](https://framerhub.io/components/smart-breadcrumbs) [<h3>**Time To Read**</h3>Automatically calculates and displays reading time for your page.**Read Time****Calculator****Blog**](https://framerhub.io/components/time-to-read) [<h3>**CMS Gallery Slider**</h3>Transform CMS galleries into smooth, animated sliders with customizable thumbnails and navigation.**Interactive****Slider****CMS**](https://framerhub.io/components/cms-gallery-slider) [<h3>**CMS Masonry Lightbox**</h3>Transform your CMS collections into beautiful masonry galleries with built-in lightbox and filtering—no code required.**CMS****Masonry****Gallery**](https://framerhub.io/components/cms-masonry-lightbox) [<h3>**Swiper Carousel**</h3>The ultimate carousel component with stunning effects and total control.**Slider****Carousel****Swiper**](https://framerhub.io/components/swiper-carousel) [<h3>**Lens Zoom Gallery**</h3>Add a professional magnifying lens effect to showcase product details and image galleries.**Interactive****Zoom****Magnifier**](https://framerhub.io/components/lens-zoom-gallery) ## Which cms & galleries component should you use? - [~~CMS Masonry Lightbox~~](https://framerhub.io/components/cms-masonry-lightbox): A masonry grid with lightbox from a CMS field - [~~CMS Gallery Slider~~](https://framerhub.io/components/cms-gallery-slider): A slider gallery on CMS detail pages - [~~Swiper Carousel~~](https://framerhub.io/components/swiper-carousel): A full-featured carousel - [~~AutoTOC~~](https://framerhub.io/components/auto-toc): A table of contents for blog posts - [~~Smart Breadcrumbs~~](https://framerhub.io/components/smart-breadcrumbs): Breadcrumbs with schema markup - [~~Time To Read~~](https://framerhub.io/components/time-to-read): Reading time on articles ## Galleries straight from the CMS Framer's CMS can store an image gallery on each item, but showing it as a masonry grid with a lightbox, or as a slider with thumbnails, normally takes custom code. CMS Gallery Lightbox, CMS Gallery Popup, CMS Gallery Slider and CMS Masonry Lightbox read the gallery field directly, so every CMS item gets its own gallery on the detail page without building it by hand. ## Helpers for long-form pages For blogs and docs, Auto TOC builds a table of contents from your headings and tracks the reader's position, Smart Breadcrumbs adds breadcrumb navigation with schema markup, and Time to Read works out reading time from the page. Swiper Carousel and Infinite Gallery cover sliders and scrolling galleries outside the CMS. ## CMS & Galleries FAQ ### Can these galleries read my CMS images automatically? Yes. The CMS gallery components connect to a gallery field in your collection, so each item shows its own images. ### Which gallery component should I use? CMS Masonry Lightbox and CMS Gallery Lightbox lay images out in a masonry grid that opens into a lightbox, CMS Gallery Popup opens a popup with thumbnail navigation, and CMS Gallery Slider shows images as a slider. ### Do Auto TOC and Smart Breadcrumbs help SEO? They help readers and crawlers understand page structure: Auto TOC adds in-page links to each section, and Smart Breadcrumbs adds breadcrumb schema to the page. ### Are these Framer cms & galleries components free? Some are free with a FramerHub account, and the rest are one-time purchases with lifetime updates. Each card shows its price. ### How do I add one to my Framer project? Open the component page, get it (free or paid), then copy it from your FramerHub dashboard and paste it onto your Framer canvas. Its settings appear in the properties panel. ## Keep exploring [Backgrounds](https://framerhub.io/components/category/backgrounds) [3D & WebGL](https://framerhub.io/components/category/3d-webgl) [Text Effects](https://framerhub.io/components/category/text-effects) [Animations](https://framerhub.io/components/category/animations) [Visual & Image Effects](https://framerhub.io/components/category/visual-effects) [Interactive & UI](https://framerhub.io/components/category/interactive) [Framer CMS gallery guide](https://framerhub.io/blog/framer-cms-gallery-guide) [Framer CMS guide](https://framerhub.io/blog/framer-cms-complete-guide) [CMS Filter plugin](https://framerhub.io/plugins/framer-cms-filter) [All components](https://framerhub.io/components)

## Sitemap

See the full [sitemap](/sitemap.md) for all pages.
