Modern lightweight Vue 3 carousel component
- 📱 Responsive - Breakpoints support
- 🔄 Infinite Scroll - Wrap around sliding
- 🖱️ Mouse/Touch - Dragging support
- 🖲️ Mouse Wheel - Scroll navigation support
- ⚡ Auto Play - Automatic sliding
- 🎯 Slide Classes - Active & visible states
- 🌐 RTL - Right-to-left support
- ♿ A11y - Keyboard navigation & ARIA labels
- 📊 Vertical - Vertical sliding mode
# npm npm i vue3-carousel # yarn yarn add vue3-carousel # pnpm pnpm install vue3-carousel<script setup> // If you are using PurgeCSS, make sure to whitelist the carousel CSS classes import 'vue3-carousel/carousel.css' import { Carousel, Slide, Pagination, Navigation } from 'vue3-carousel' const carouselConfig = { itemsToShow: 2.5, wrapAround: true } </script> <template> <Carousel v-bind="carouselConfig"> <Slide v-for="slide in 10" :key="slide"> <div class="carousel__item">{{ slide }}</div> </Slide> <template #addons> <Navigation /> <Pagination /> </template> </Carousel> </template>Visit our documentation website for detailed usage and examples:
- Getting Started
- Carousel Configuration
- Carousel Component
- Slide Component
- Navigation Component
- Pagination Component
For Nuxt users, check out vue3-carousel-nuxt module.
![@dependabot[bot]](https://avatars.githubusercontent.com/in/29110?s=64&v=4){kind=small}
