<header class="header">
  <img class="header__twicpics-logo" src="https://assets.twicpics.com/videos/demo-twicpics/logo-white.png" alt="TwicPics logo" />
</header>

<main>
  <figure>
    <img data-twic-src="media:refit/sneakers-06.jpg" data-twic-transform="refit=WxH" alt="" />
  </figure>
</main>

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

.header {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 10px;
  background-color: #9002ff;
}

.header__twicpics-logo {
  width: 140px;
}

main {
  display: flex;
  justify-content: center;
  padding: 50px;
}

figure {
  position: relative;
  width: 400px;
  height: 400px;
}

figure img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transition: opacity 0.3s;
  will-change: opacity;
}

figure img.twic-done {
  opacity: 1;
}