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

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

body {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100vh;
  background-color: #C7D3BF;
}

.square-ball {
  width: 40px;
  height: 40px;
  background-color: #04A777;
  border: 5px solid #048962;
  transform: rotate(45deg);
  margin: 0 15px;
}

var element = document.querySelectorAll('.square-ball');

TweenMax.to(element, 1, {
  scale: .6,
  borderRadius: '50%',
  rotation: 360,
  repeat: -1,
  repeatDelay: .5,
  yoyo: true
});