CSS Animation Generator
id/class
Dimensions
width
px
rem
%
height
px
rem
%
Background
background-color
background-repeat
repeat
repeat-x
repeat-y
no-repeat
initial
inherit
background-size
auto
length
cover
contain
initial
inherit
background-position
0px 0px
left top
left center
left bottom
right top
right center
right bottom
center top
center center
center bottom
background-image
background-origin
padding-box
border-box
content-box
initial
inherit
background-clip
border-box
padding-box
content-box
initial
inherit
background-attachment
scroll
fixed
local
initial
inherit
Design
border-radius
px
rem
%
color
opacity
font-size
font-family
border
outline
box-shadow
text-shadow
Placement
position
relative
absolute
fixed
margin
padding
top
right
bottom
left
Animation
animation-play-state
paused
running
initial
inherit
animation-name
----
keyframename
none
initial
inherit
animation-delay
----
time
initial
inherit
animation-direction
normal
reverse
alternate
alternate-reverse
initial
inherit
animation-duration
----
time
initial
inherit
animation-fill-mode
none
forwards
backwards
both
initial
inherit
animation-iteration-count
----
number
infinite
initial
inherit
animation-timing-function
----
linear
ease
ease-in
ease-out
ease-in-out
step-start
step-end
steps(int,start,end)
cubic-bezier(n,n,n,n)
initial
inherit
Transform
translate3d
----
0% 0% 0rem
0rem 0rem 0rem
scale
translate
rotate
skew
transform-origin
Render CSS