Animate border-color property with CSS

To implement animation on the border-color property with CSS, you can try to run the following code

Example

Live Demo

<!DOCTYPE html> <html>    <head>       <style>          div {             width: 500px;             height: 300px;             background: yellow;             border: 10px solid gray;             animation: myanim 3s infinite;             background-position: bottom left;             background-size: 50px;          }          @keyframes myanim {             20% {                border-color: red;             }          }       </style>    </head>    <body>       <h2>Performing Animation for color of border</h2>       <div></div>    </body> </html>
Updated on: 2020-06-25T11:31:45+05:30

867 Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements