ugly keyframe rainbow text

index.html

<p>HELLO!</p>
<p>HELLO!</p>

style.css

p {
  animation-name: rainbowtext;
  animation-duration: 5s;
  animation-timing-function: linear;
  animation-delay: 0s;
  animation-iteration-count: infinite;
}

@keyframes rainbowtext {
  0%{
    color:red;
    font-size: 20px;
  }
  25%{
    color:orange;
  }
  50% {
    color:yellow;
    font-size: 40px;
    transform: translateX(200px);
  }
  75%{
    color: green;
  }
  
  85%{
    color: blue
  }
  100% {
    color: purple;
    font-size:20px;
  }
}

ugly-keyframe-rainbow-text.markdown

ugly keyframe rainbow text

A Pen by Colt Steele on CodePen.

License.