<!DOCTYPE html>
<html>
<head>
<style>
#myanim {
width: 100px;
height: 100px;
background-color: #F00;
border-radius:20px;
animation-name: example;
animation-duration: 2s;
animation-iteration-count: infinite;
animation-direction: reverse;
}
@keyframes example {
0% {background-color:#0F0; border-radius :40px;}
25% {background-color:#00F; border-radius:50px;}
50% {background-color:#999; border-radius:50px;}
100% {background-color:#F00; border-radius:40px;}
}
</style>
</head>
<body>
<div align="center">
<div id="myanim"></div>
</div>
</body>
</html>