Professional CSS Animation Generator
Animated
1s
0s
@keyframes fade {
from { opacity: 0; }
to { opacity: 1; }
}
.animated-element {
width: 100px;
height: 100px;
display: flex;
align-items: center;
justify-content: center;
color: white;
font-weight: bold;
border-radius: 8px;
animation-name: fade;
animation-duration: 1s;
animation-delay: 0s;
animation-iteration-count: infinite;
animation-timing-function: ease;
animation-direction: normal;
animation-fill-mode: forwards;
background-color: #3490dc;
}
<div class="animated-element">Animated</div>