Back to tools
🎬Developer
CSS Animation Builder
Visually build CSS @keyframes animations with a keyframe editor, timing controls, presets, and live preview.
Presets
Preview
Animation Settings
1s
Keyframes
0%
1
1
100%
1
1
@keyframes myAnimation {
0% {
background-color: #6366f1;
}
100% {
background-color: #6366f1;
}
}
.element {
animation: myAnimation 1s ease 1 normal none;
}