Keyframes动画生成

可视化编辑关键帧，输出完整 @keyframes CSS代码，支持实时预览

动画名称

动画时长(s)

关键帧列表

百分比%

动画预览

生成代码

@keyframes demoAnim {
  0% { transform: translateX(0); opacity:1; }
  100% { transform: translateX(120px); opacity:0; }
}

animation: demoAnim 1s infinite;