JSFiddle - React, Tailwind, and code Playground

HTML

<section>
<div><img src="https://bipbap.ru/wp-content/uploads/2017/08/04.-risunki-dlya-srisovki-legkie-dlya-devochek.jpg" alt=""></div>
<div><img  src="https://bipbap.ru/wp-content/uploads/2017/05/0_15a1ca_7d6d6585_-1-L.jpg" alt=""></div>
<div><img  src="https://papik.pro/uploads/posts/2022-01/1641720854_1-papik-pro-p-mirnogo-dnya-kartinki-1.jpg" alt=""></div>
</section>

CSS

* {
  box-sizing: border-box
}

html,
body {
  height: 100%;
  padding: 0;
  margin: 0;
}

section {
  display: flex;
}

div {
  flex:1;
  position: relative;
  overflow: hidden;
}
div::after {
  content: '';
  display: block;
  padding-top: 100%;
}
img {
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  position: absolute;
  left: 0;
  top: 0;
}