html

<div style="height: 64px;width: 64px;">
   <div class="point point1" style="position: relative; margin: 0 auto"></div>
</div>

css

.point,.point::before,.point::after{position: absolute;width: 12px; height: 12px; border-radius: 50%;content: ""; }
.point::before{animation: scale 2s infinite; left: 0px}
.point::after{animation: scale2 2s infinite; left: 0px}
.point1,.point1::before,.point1::after{ background-color: rgb(13,90,245);}
@keyframes scale{0%{ transform: scale(1); opacity:.9}100%{ transform: scale(6); opacity: 0;}}
@keyframes scale2{0%{ transform: scale(1);opacity:.9;}100%{ transform: scale(12);opacity:0;}}