A CodePen by Erik Sundahl. CSS3 Transform Loader

index.html

<div class='loading'>!</div>

style.css

body {
  background: #000;
  text-align: center;
  margin: 100px
}

.loading {
  color: #fff;
  border: 5px solid #fff;
  border-radius: 20px;
  display: inline-block;
  font-size: 6em;
  height: auto;
  text-align: center;
  padding: 50px;
  margin: 0 auto;
  -webkit-animation-name:             fade, rotate; 
  -webkit-animation-duration:         5s; 
  -webkit-animation-iteration-count:  infinite;
  -webkit-animation-timing-function:  linear;
  -webkit-animation-delay:            0;
}
 
@-webkit-keyframes rotate {
  0% {
    -webkit-transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
  }
}
@-webkit-keyframes fade {
  0% { opacity: 0; }
  50% { opacity: 1; }
  100% { opacity: 0; }
}