<div class="container">
  <div class="dot"></div>
  <div class="dot"></div>
  <div class="dot"></div>

</div>

body {
  display:flex;
  justify-content:center;
  margin-top:5rem;  
}
.dot {
  display: inline-block;
  width: 15px;
  height: 15px;
  border-radius: 15px;
  background-color: #4b9cdb;
}


.container .dot:nth-last-child(1) {
  animation: expandAnimation 1.2s 0.6s linear infinite;
}
.container .dot:nth-last-child(2) {
  animation: expandAnimation 1.2s 0.3s linear infinite;
}
.container .dot:nth-last-child(3) {
  animation: expandAnimation 1.2s 0s linear infinite;
}

@keyframes expandAnimation {
  0 {
    height: 15px;
  }
  50% {
    height: 35px;
  }
  100% {
    height: 15px;
  }
}