Css animation rainbow effect based on rotating hue colors

style-animation-rainbow.css

/**
 * Found in http://mapbox.com footer (hover robot)
 */
.element:hover {
  -webkit-animation: rainbow 4s steps(36) infinite;
}

@-webkit-keyframes rainbow {
   from { -webkit-filter:hue-rotate(10deg); }
     to { -webkit-filter:hue-rotate(360deg); }
}

@keyframes rainbow {
 from {
    -webkit-filter:hue-rotate(10deg);
            filter:hue-rotate(10deg);
    }
  to {
    -webkit-filter:hue-rotate(360deg);
            filter:hue-rotate(360deg);
    }
}