Free Photos
WordPress Themes

CSS : simple shape : color change

HTML
<p>Hello</p>
CSS
p{ font-size: 50px; text-align: center; background-color: red; width: 300px; height: 300px; line-height: 300px; margin:80px auto; color: white; animation-name: change; animation-iteration-count: infinite; animation-duration: 3s; } @keyframes change { 0%{color: black; background-image: linear-gradient(to right,#36DBCA,#EFDC05); border-radius:100%;} 60%{color: white; background-image: linear-gradient(to left,#abcdef,#8012dd); border-radius:50% 0%;} 80%{color: white; background-image: linear-gradient(to left,#fed485,#aa4567); border-radius:0% 50%} 100%{color: white; background-image: linear-gradient(to left,#ff0044,#00ff58); border-radius:0%;} }
JAVASCRIPT
Expand for more options Login