JSFiddle - React, Tailwind, and code Playground

HTML

<div class="square-box"> </div>

CSS

.square-box {
  width:50%;
  padding-top:50%;
  background: #4679BD;
  
}

/*.square-box:before {
  content: "";
  display: block;
  padding-top: 100%;
}*/