⚡
快速工具集
中文
CSS 动画预览
CSS 动画预览
编辑 CSS animation 属性，实时预览动画效果
CSS 编辑器
动画名称
持续时间
缓动函数
ease-in-out
循环次数
方向
normal
填充模式
none
关键帧 @keyframes
@keyframes bounce { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-50px); } }
元素样式
width: 96px; height: 96px; background: #6b84ad; border-radius: 12px;
应用
重置
复制 CSS
预览
重播
暂停
预设动画
弹跳
脉冲
旋转
抖动
淡入
滑入
翻转
摇摆
说明
CSS 动画预览工具让你实时编辑和查看 CSS 动画效果。
修改关键帧可自定义动画效果
支持多种缓动函数
可导出完整的 CSS 代码