<main>
  <div style="width:33%">
    <img
         data-twic-src="image:cat_1x1.jpg"
         src="https://demo.twic.pics/v1/output=preview/image:cat_1x1.jpg"
         >
  </div>
  <div style="width:50%;height:200px">
    <img
         data-twic-src="image:cat_1x1.jpg"
         src="https://demo.twic.pics/v1/output=preview/image:cat_1x1.jpg"
         >
  </div>
   <div style="width:50%;height:200px">
    <img class="contain"
         data-twic-src="image:cat_1x1.jpg"
         src="https://demo.twic.pics/v1/output=preview/image:cat_1x1.jpg"
         >
  </div>
</main>
<div>
  I will CLS
</div>

<!-- Installation of the TwicPics. That's it, you're all set! -->
<script src="https://demo.twic.pics/?v1" async defer></script>

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  font-family: "Montserrat", sans-serif;
  color: #454446;
}

main {
  padding:2em;
  display:flex;
  gap: 10px;
}


div{
  background-color : #1CFFA6;
}


img {
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}

.contain{
  object-fit:contain;
}