JSFiddle - React, Tailwind, and code Playground

HTML

<div style="width: 50px;">
    <div class="img-wrapper">
    <div class="img-wrapper2">
        <img src="http://placekitten.comp/100/100" width="200" height="200" alt="Alt Text">
    </div>
    </div>
</div>

CSS

img {
    max-width: 100%;
    height: auto;
}

.img-wrapper {
    max-width: 200px;
}

.img-wrapper2 {
    background: blue;
    height: 0;
    padding-bottom: 100%;
}