JSFiddle - React, Tailwind, and code Playground

by RadCor

HTML

<div>
  <img src="https://pp.userapi.com/c637630/v637630769/67fa5/5IDc4a4q2dU.jpg" alt="">
</div>

<br>

<div>
  <img src="https://cs7063.userapi.com/c635103/v635103858/2971d/fFDApzEMtMc.jpg" alt="">
</div>

CSS

div {
  display: flex;
  width: 200px;
  height: 200px;
  overflow: hidden;
  position: relative;
}
div img {
  position: relative;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  object-fit: cover;
}

JavaScript

/* 

Ответ 2 на вопрос: https://toster.ru/q/430494

*/