CSS Animation Studio

Build CSS animations visually. Adjust the controls, watch the live preview, and copy the generated CSS.

Elements

Transform

Position X 0px Position Y 0px Scale 1 Rotate 0deg Skew X 0deg Skew Y 0deg Transform origin

Appearance

Opacity 1 Border radius 8% Background color

Timing

Duration (s) 1s Delay (s) 0s Timing function Direction Fill mode Infinite loop

Live preview

Generated CSS

HTML example