JSFiddle - React, Tailwind, and code Playground

by WORKMAN

HTML

<div class="center">
  <div><img src="https://pp.userapi.com/c837322/v837322210/33ccb/saIIiGQzX7g.jpg" alt="" /></div>
  <div><img src="https://pp.userapi.com/c837322/v837322210/33ccb/saIIiGQzX7g.jpg" alt="" /></div>
  <div><img src="https://pp.userapi.com/c837322/v837322210/33ccb/saIIiGQzX7g.jpg" alt="" /></div>
  <div><img src="https://pp.userapi.com/c837322/v837322210/33ccb/saIIiGQzX7g.jpg" alt="" /></div>
</div>

CSS

.center {
  text-align: center;
  padding: 0 30px;
  box-sizing: border-box;
  transform: scale(0.8);
  transition: transform 0.5s;
}

img {
  margin: 0 auto;
}

.slick-current {
  transform: scale(1);
}

JavaScript

$('.center').slick({
  centerMode: true,
  centerPadding: '0',
  slidesToShow: 3
});