JSFiddle - React, Tailwind, and code Playground

by Dedi Wibisono

HTML

<div class="circle">
  <div class="img">
<img src="https://cdn-icons-png.flaticon.com/512/11986/11986545.png" alt="">    
  </div>
</div>

<div class="button">
  Submit
</div>

CSS

.circle {
  width:200px;
  margin:60px;
  aspect-ratio: 1/1;
  border-radius: 50%;
  background: #ccc;
  place-items: center;
  display: grid;
}

.img {
  width: 50%;
  height: 50%;
}

.img img {
  width: 100%;
  height: 100%;
  object-fit: contain
}

.button {
  width: fit-content;
  background: #eee;
  padding: .5rem 0;
  padding-inline: 1.5rem;
}