CSS keyframes allow you to animate elements. In the following examples, we specify animation names for the elements and provide a @keyframes code block. These are simple animations that change from a beginning to end state using the from{} and to{} code blocks.
An Example:
#black
{
background-color: black;
animation-name:changecolor;
animation-duration:4s;
}
@keyframes changecolor
{
from
{
background-color: black;
}
to
{
background-color: red;
}
}