Icon Motion Studio

entrance & attention animation preview
Designed for designers. Built by Rio Dewantoro.
100%
Drop an .svg anywhere on stage, or use Upload SVG in the panel →
0 / 700 ms

Source

Using placeholder mark — upload iconweebku.svg

Quick Start

Analyzes your icon and applies a tasteful animation automatically.

Animation

Timeline

700 ms
0 ms

Export CSS


        
      

      
Generated from the current preset + timeline. Apply the class to your icon element.

    


    

      
Export GIF

      

        

          

          
        

        

          

          
        

      

      

        

        
      

      
      
Transparent background. 256 colors — banding on smooth gradients.

    


    

      
Export APNG

      

        Full-quality animated PNG — millions of colors (no GIF banding), true transparency, plays
        natively in every modern browser.
      

      

        

          

          
        

        

          

          
        

      

      

        

        
      

      
      
Transparent background. Full color.

    


    

      
Export MP4

      

        Real video — the easiest format to share anywhere (WhatsApp, Instagram, any device).
        Background can't be transparent, so pick a solid color below.
      

      

        

          

          
        

        

          

          
        

      

      
      
Records one playthrough in real time.

    


    

      
Export JSON

      

        Vector JSON — plays crisp at any size on web, iOS, or Android. Sequenced layer timing,
        reveal easing, and Stroke Draw all carry over.