0% Complete


A carousel is used to display multiple pieces of visual content without taking up too much space. Carousels eliminate the need to scroll down the page to see all content and are a popular method of displaying marketing information.We use Swiper for implement Carousel component you can see the documentation Swiper Svelte.


Use a carousel to make your website design more visually appealing for users. In the default carousel design, respective elements slide automatically and users can go to the next slide by clicking an arrow.


Set the autoplay prop to auto play slide change.


Set the navigation prop to change slide by Next or Previous button.


Here is the list of additional modules imports:

  • Virtual - Virtual Slides module

  • Keyboard - Keyboard Control module

  • Mousewheel - Mousewheel Control module

  • Navigation - Navigation module

  • Pagination - Pagination module

  • Scrollbar - Scrollbar module

  • Parallax - Parallax module

  • FreeMode - Free Mode module

  • Grid - Grid module

  • Zoom - Zoom module

  • Lazy - Lazy module

  • Controller - Controller module

  • A11y - Accessibility module

  • History - History Navigation module

  • HashNavigation - Hash Navigation module

  • Autoplay - Autoplay module

  • EffectFade - Fade Effect module

  • EffectCube - Cube Effect module

  • EffectFlip - Flip Effect module

  • EffectCoverflow - Coverflow Effect module

  • EffectCards - Cards Effect module

  • EffectCreative - Creative Effect module

  • Thumbs - Thumbs module