<div class="flex justify-center my-20 space-x-3">
  <div class="animate-ping  h-2 w-2 bg-blue-600 rounded-full"></div>
  <div class="animate-ping  h-2 w-2 bg-blue-600 rounded-full animation-delay-200"></div>
  <div class="animate-ping  h-2 w-2 bg-blue-600 rounded-full animation-delay-400"></div>
</div>
.animation-delay-100 {
  animation-delay: 0.1s;
}

.animation-delay-200 {
  animation-delay: 0.2s;
}

.animation-delay-400 {
  animation-delay: 0.4s;
}

External CSS

  1. https://cdnjs.cloudflare.com/ajax/libs/tailwindcss/2.2.19/tailwind.min.css

External JavaScript

This Pen doesn't use any external JavaScript resources.