Loadingdotspulseloading

Pulsing Dots

Three dots that pulse in sequence. A modern alternative to spinners, popular in chat apps and messaging interfaces.

.dots-pulse {
  display: flex;
  gap: 6px;
}
.dots-pulse span {
  width: 10px;
  height: 10px;
  background: #8b5cf6;
  border-radius: 50%;
  animation: pulse 1.2s ease-in-out infinite;
}
.dots-pulse span:nth-child(2) { animation-delay: 0.2s; }
.dots-pulse span:nth-child(3) { animation-delay: 0.4s; }
@keyframes pulse {
  0%, 100% { transform: scale(0.6); opacity: 0.4; }
  50% { transform: scale(1); opacity: 1; }
}

More Loading effects