JSFiddle - React, Tailwind, and code Playground

by Csaba Hellinger

HTML

<div>

  <img src="https://post.medicalnewstoday.com/wp-content/uploads/sites/3/2020/02/322868_1100-732x549.jpg" />
  
</div>

CSS

body { background: #222; }

div {
  width: 400px;
  height: 300px;
  overflow: hidden;
  border-radius: 20px;
}

img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 300ms ease;
}

img:hover {
  transform: scale3d(1.03, 1.03, 1);
}