一个很好看的CSS加载动画。

<!-- html -->
<div class="loader"></div>

/*CSS*/
@keyframes wiggle{
 0% {
    transform:rotate(0) scale(1)
  }
 50% {
   transform:rotate(180deg) scale(.5)
  }
 100% {
    transform:rotate(360deg) scale(1)
 }
}
.loader{
  margin: 0 auto;
 display: inline-block;
  width: 100%;
  text-align: center;
 height: 50px;
}
.loader::after, .loader::before{
  box-sizing: border-box;
 content: "";
  width: 50px;
  height: 50px;
 position: absolute;
 border: 8px solid transparent;
  border-radius: 50%;
 animation: wiggle 1.4s ease infinite;
}
.loader::before{
  border-top-color: #4285f4;
  border-bottom-color: #34a853;
}
.loader::after{
 border-left-color: #fbbc05;
 border-right-color: #ea4335;
  animation-delay: .7s;
}