CodePen Embed - yRJPGj

<div class="slider">
  <div class="slide"><img src="https://via.placeholder.com/200x150" alt=""></div>
  <div class="slide"><img src="https://via.placeholder.com/200x150" alt=""></div>
  <div class="slide"><img src="https://via.placeholder.com/200x150" alt=""></div>
  <div class="slide"><img src="https://via.placeholder.com/200x150" alt=""></div>
  <div class="slide"><img src="https://via.placeholder.com/200x150" alt=""></div>
  <div class="slide"><img src="https://via.placeholder.com/200x150" alt=""></div>
  <div class="slide"><img src="https://via.placeholder.com/200x150" alt=""></div>
  <div class="slide"><img src="https://via.placeholder.com/200x150" alt=""></div>
  <div class="slide"><img src="https://via.placeholder.com/200x150" alt=""></div>
  <div class="slide"><img src="https://via.placeholder.com/200x150" alt=""></div>
</div>

body {
  margin: 50px;
}

.slider {
  width: 760px;
}

.slide {
  transition: all 0.5s;
  outline: none;
  margin: 0 5px;
}

.slick-track {
  margin: 100px 0;
}

.slick-center {
  transform: scale(2);
}

$(document).ready(function(){
  $('.slider').slick({
    arrows: false,
    dots: false,
    centerMode: true,
    centerPadding: '60px',
    slidesToShow: 3,
  });
});

This Pen is owned by L2Banners on CodePen. It is a fork of this Pen.

See more by @L2Banners on CodePen

External CSS

//cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.css

External CSS

External JavaScript