<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style type="text/css"> #img{ 200px; height:200px; border:100px solid green; border-left-color: red; border-right-color: black; border-top-color: yellow; margin:100px; border-radius:50%; -webkit-animation:circle 1s infinite linear; -moz-animation:circle 1s infinite linear; } @-webkit-keyframes circle{ 0%{ transform:rotate(0deg); } 100%{ transform:rotate(-360deg); } } @-moz-keyframes circle{ 0%{ transform:rotate(0deg); } 100%{ transform:rotate(-360deg); } } </style> </head> <body> <div id="img"></div> </body> </html>