Top Vue.js Carousel & Slideshow Components 2024

Needing to build carousels have caused me some of the most painful moments of my freelance career. I have probably seen every version of them that designers can think of.

So, before you use a carousel: Have you checked shouldiuseacarousel.com? 🙃

No, but seriously: If you’re sure you need a carousel, there are a lot of great options to choose from. There are some awesome libraries built with and for Vue that evolve nicely, as well as wrappers for popular JS libraries.

I'll keep the list updated, as I work my way through new components. If you think I should include one in particular, reach out on Twitter @MadeWithVueJS!

Flicking for Vue  2714

  • ✅ Support for Vue 2 + 3

Flicking is a flexible and extendable carousel component. It's based on TypeScript and comes with an official Vue 2 + 3 wrapper.

It offers various settings to optimize performance (always a concern with carousels) as well as animations and behaviours you can choose from.

It's pretty flexible, so you can use it for all kinds of custom sliding animations (see these demos!).

Vue Flicking Wrapper for the Flicking Carousel Component
icon-eye-dark Created with Sketch. 14.588

Fullpage for Vue 1842

  • ✅ Support for Vue 2 + 3

This is not really a slider, or is it? Fullpage.js lets you easily create fullscreen scrolling sites, and it has an official Vue wrapper. It has a sweet set of basic functionality (supporting f.ex. horizontal and vertical scrolling slides) but you can also enhance it with extensions for more effects like parallax views.

It’s incredibly easy to get started with, and the docs are great. I have used it to quickly prototype presentations, for example.

It’s free for open-source projects, and offers paid licenses for commercial projects.

Vue Fullpage.js Fullscreen Scrolling Websites
icon-eye-dark Created with Sketch. 22.678

Swiper Vue 39230

  • ✨ Support for Vue 3

Swiper is a slider component for mobile, focusing on touch support and native behaviour. It's part of the cross-platform frameworks Framework7 and Ionic.

It's super flexible and comes with a lot of useful features out of the box, including transition animations, infinity mode or autoplay. The rich API lets you create your own pagination, navigation or effects.

Swiper Vue Mobile Slider Component
icon-eye-dark Created with Sketch. 11.060

Vue 3 Carousel 702

  • ✨ Support for Vue 3

vue3-carousel is a lightweight Vue 3 carousel component supporting touch & mouse dragging, autoplay, infinity scrolling, gallery views and more. It definitely offers all the features you need for basic use cases and is being actively developed.

The component is open-source, currently only supporting Vue 3.

Vue 3 Carousel Carousel Component
icon-eye-dark Created with Sketch. 33.285

VueFlux 529

  • ✨ Support for Vue 3

VueFlux is an image slider component built with Vue 3 that comes with a large amount of 2D and 3D transition effects, including a book-like page turning effect, a waterfall-like effect and more. It also offers customizable options for paginations, preloaders and controls.

VueFlux is responsive and mobile-friendly, supporting arrow key and swipe navigation.

You can see all the effects and configuration options in the demo gallery

VueFlux Image Slider Component
icon-eye-dark Created with Sketch. 15.809

Similar Articles
The best Vue.js Admin Dashboards 2024
19.01.2024  •  in #UI Components
In this post, you'll find a growing collection of free & premium Vue.js admin dashboard templates! They're all versatile, easy to use, responsive and high-quality. If you think I'm missing an essential entry on this list, tell me on Twitter @MadeWit...
Best Vue.js Datatables 2024
12.02.2024  •  in #UI Components
Datatables are a complex beast. If you ever built data-heavy business applications, you will probably know it's not easy to make them readable and clear. Discover some of the best datatable components for Vue.js that are flexible enough to adapt to your data and use case.