<!-- Slider main container -->
<div class="swiper-container">
    <!-- Additional required wrapper -->
    <div class="swiper-wrapper">
       <!-- Slides -->
       <div class="swiper-slide c1">Slide 1</div>
       <div class="swiper-slide c2">Slide 2</div>
       <div class="swiper-slide c3">Slide 3</div>
      <div class="swiper-slide c1">Slide 4</div>
      <div class="swiper-slide c2">Slide 5</div>
    </div>
    <!-- If we need pagination -->
<!--     <div class="swiper-pagination"></div> -->
    
    <!-- If we need navigation buttons -->
    <div class="swiper-button-prev"></div>
    <div class="swiper-button-next"></div>
</div>
.swiper-container {
    width: 800px;
    height: 400px;
}
.c1 {
  background-color: red;
}
.c2 {
  background-color: green;
}
.c3 {
  background-color: blue;
}
var mySwiper = new Swiper ('.swiper-container', {
  // Optional parameters
  loop: true,
  slidesPerView : 2,
  centeredSlides : true,
  effect : 'coverflow',
  coverflow: {
            rotate: 0,
            stretch: 0,
            depth: 300,
            modifier: 1,
            // slideShadows : true
        },
   
  // If we need pagination
  pagination: '.swiper-pagination',
   
  // Navigation arrows
  nextButton: '.swiper-button-next',
  prevButton: '.swiper-button-prev',
    
  }) 

External CSS

  1. https://cdn.bootcss.com/Swiper/4.0.7/css/swiper.min.css

External JavaScript

  1. https://cdn.bootcss.com/Swiper/3.4.2/js/swiper.min.js