---
title: "Thumbnail Slider — Free Framer component · Best of Framer"
description: "Free Framer component · by 7 Sync Technologies · Carousels. Thumbnail Slider modes, multiple effects, hover zoom, lightbox, image/video/Lottie/GIF support, autoplay, infinite loop, progress…"
canonical: "https://framer.elliotli.dev/component/thumbnailslider"
---

[Home](/)/[Components](/components)/[Carousels](/components/category/carousels)/Thumbnail Slider

# Thumbnail Slider

Modern media navigation slider

[View on Framer](https://framer.com/marketplace/components/thumbnailslider/?via=elliot-li)

![Thumbnail Slider preview image 1](https://framer.elliotli.dev/og/component/thumbnailslider/a2a32906d715297f/1600x1200.jpg)

## Summary

Thumbnail Slider modes, multiple effects, hover zoom, lightbox, image/video/Lottie/GIF support, autoplay, infinite loop, progress bar, counter, and advanced customization.

## Description

## Features

-   Main image slider
    
-   Thumbnail navigation
    
-   Horizontal & vertical layouts
    
-   Autoplay support
    
-   Progress bar
    
-   Navigation arrows
    
-   Pagination dots
    
-   Slide counter
    
-   Infinite loop
    
-   Custom arrow icons
    
-   Responsive design
    

## Customization

### Main Slider

-   Slides per view
    
-   Slide spacing
    
-   Border radius
    
-   Transition speed
    
-   Object fit
    

Thumbnail Tray

-   Thumbnail count
    
-   Active styles
    
-   Thumbnail spacing
    
-   Border radius
    
-   Tray offset
    

Navigation

-   Separate or grouped arrows
    
-   Custom arrow icons
    
-   Radius support
    
-   Arrow size
    
-   Hover effect
    

Progress Bar

-   Top or bottom placement
    
-   Custom colors
    
-   Adjustable height
    
-   Radius support
    

### Perfect For

-   Product galleries
    
-   Portfolio sliders
    
-   Hero sections
    
-   Photography showcases
    
-   E-commerce previews
    

Built With

-   React
    
-   Framer Property Controls
    
-   Swiper.js
    

Preview: [https://thumbnail-slider.framer.website](https://thumbnail-slider.framer.website)

## Pro Version

Need more advanced features? Upgrade to Thumbnail Slider Max with Normal & Thumbnail Slider modes, multiple effects, hover zoom, lightbox, image/video/Lottie/GIF support, autoplay, infinite loop, progress bar, counter, and advanced customization.

Get Thumbnail Slider Max :- [https://www.framer.com/community/marketplace/components/thumbnail-slider-max/](https://www.framer.com/community/marketplace/components/thumbnail-slider-max/)

**If you have any questions and need support, contact us at** [**hello@7synctech.com**](mailto:hello@7synctech.com)**. We're happy to help.**

Image Carousel, Carousel Slider, Image Gallery, Media Slider, Product Gallery, Auto Play Slider, Responsive Carousel, Framer Carousel, Framer Slider, Thumbnail Gallery, Photo Slider, Portfolio Gallery, Interactive Carousel, Gallery Slider, Swipe Slider, Modern Carousel, Image Showcase, Animated Slider, Responsive Gallery.

![](https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/description-image-rrvx82ek-NNjx6pt27U4hoeWn1mySax8tVE4MA6)

## Rank history [How rankings work →](/terms#rankings)

-   All · #180

## Details

- **Author**: 7 Sync Technologies
- **Published**: 2026-06-06
- **Updated**: 2026-08-20
- **Added**: 2026-05-29
- **Categories**: Carousels

## More like this

-   [Screen Stage Mockup](/component/screen-stage-mockup) — Aisol Studio · $14 — Your screens in synced devices
-   [Team Reel](/component/team-reel) — Ali Musa · Free — Interactive Team Showcase
-   [Slider](/component/slider) — MAS · Free — A smooth, customizable slider.
-   [Cascade Card Slider](/component/cascade-card-slider) — Tim Yeng · Free — Cards that cascade into view