---
title: "Swiper Carousel — Framer component · Best of Framer"
description: "$18.00 · Framer component · by FramerHub.io  · Carousels. The ultimate carousel component."
canonical: "https://framer.elliotli.dev/component/swiper-carousel"
---

[Home](/)/[Components](/components)/[Carousels](/components/category/carousels)/Swiper Carousel

# Swiper Carousel

The ultimate carousel component.

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

![Swiper Carousel preview image 1](https://framer.elliotli.dev/og/component/swiper-carousel/754e2eb0e2d8aada/1600x1200.jpg)

## Summary

The ultimate carousel component.

## Description

[![](https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/description-image-e1q547s4-LYU34W86U5p8dCr6SAZf3vP9W2glXO)](https://framerhub.io/components?utm_source=framer_marketplace&utm_medium=framer_marketplace_components&utm_content=SwiperCarousel)

### Overview

A powerful, designer-friendly carousel component powered by Swiper.js with all the bells and whistles - effects, navigation, autoplay & more!

![](https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/description-image-c6arjz0h-8xE5hj8mxsz1YHRqo5EPsVKmSAHb80)

### Features

**5 Stunning Effects** Choose from Slide, Fade, Coverflow, Flip, or Cards effects. Each effect comes with its own customization options to perfect the look.

**Complete Navigation Control** Add navigation arrows, pagination bullets (or fraction/progress bar), and scrollbar. Customize colors and sizes to match your design.

**Smart Autoplay** Set your carousel to auto-advance with customizable timing. Pause on hover keeps users in control.

**Multiple Interaction Modes** Enable keyboard navigation, mousewheel scrolling, and touch/drag functionality.

**Slot-Based Content** Connect any frame or component to the carousel slots for total design flexibility. Support for multiple slides per view and custom gap settings.

### Use Cases

**Hero Sections** — Create eye-catching homepage heroes with the Fade or Slide effects.

**Product Galleries** — Showcase products with the Coverflow effect for that premium feel.

**Testimonials** — Display customer reviews with the elegant Fade effect.

**Portfolio** — Show off your work with the playful Cards effect.

**Image Galleries** — Full-screen image viewing with customizable transitions.

### Properties

-   **Slide Content**: Slot to connect slide frames
    
-   **Direction**: Horizontal or Vertical scrolling
    
-   **Slides Per View**: Number of slides visible at once
    
-   **Gap**: Space between slides
    
-   **Center Slides**: Center the active slide
    
-   **Effect**: Choose from 5 transition effects
    
-   **Arrows**: Toggle arrows and customize style (supports custom icons)
    
-   **Pagination**: Toggle bullets/fraction/progressbar
    
-   **Scrollbar**: Toggle scrollbar
    
-   **Autoplay**: Auto-advance settings
    
-   **Loop**: Infinite scrolling
    
-   **Rewind**: Jump back to start if loop is off
    
-   **Speed**: Transition duration
    
-   **Free Mode**: Free scrolling without snapping
    
-   **Interaction**: Touch, Keyboard, Mousewheel support
    
-   **Styling**: Slide radius, Full pagination/scrollbar color control
    

### Customization

The component is organized into intuitive sections for easy customization:

**Slides**

-   Connect your frames to the Slide Content slot.
    

**Layout**

-   Direction: Horizontal or Vertical scrolling
    
-   Slides Per View: Show multiple slides at once
    
-   Gap: Space between slides
    
-   Center Slides: Center the active slide
    

**Effects**

-   Slide: Classic sliding transition
    
-   Fade: Smooth crossfade between slides
    
-   Coverflow: Album cover-style effect
    
-   Flip: 3D card flip
    
-   Cards: Stacked cards effect
    

**Navigation & Pagination**

-   Fully customizable arrows (colors, borders, hover states) and pagination indicators.
    

## License

**Single Use License** — Use in one client project with full commercial rights. No redistribution. 1 license = 1 client.

## Refund Policy

Due to the nature of our digital products, we are unable to offer refunds, but we're here to assist you with any questions or concerns!

### Version

1.1.0

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

-   All · #8141

## Details

- **Author**: FramerHub.io
- **Price**: $18.00
- **Published**: 2026-04-12
- **Updated**: 2026-04-12
- **Added**: 2026-03-27
- **Categories**: Carousels

## More like this

-   [3DCurvedImageMarquee](/component/3dcurvedimagemarquee) — Lera · $4 — Curved perspective double ticker
-   [Orbit Kit Carousel](/component/orbit-kit-carousel) — Khairul Fauzy Khairudin · $12 — 3D drag carousel with inertia
-   [Team Orbit](/component/team-orbit) — Ali Musa · Free — Interactive Team Showcase
-   [Glow Testimonial](/component/glow-testimonial) — Interface Studio · Free — Testimonials with a Little Glow