# Inserting Workspace animations Preview an approved Workspace file and add it to a Webflow page. Workspace insertion starts from a private or team-managed source and ends with either a native Webflow Lottie element or an advanced dotLottie player. ## Add the selected file 1. Select the intended page element or container in Webflow. 2. Open **Workspace** and navigate to the approved file. 3. Play the preview and confirm the current animation, palette, theme, and state-machine mode. 4. Select **Insert animation**. 5. Inspect the inserted element in the page and Navigator. Workspace animation preview ready for Webflow insertion ## Understand the result - Ordinary Lottie playback creates a Webflow Asset and native Lottie element. - dotLottie v2 or an active state machine creates an advanced player inside the selected container and adds the required page custom code. The advanced path can show a thumbnail on the design canvas while the real player runs in Preview and on the published page. ## Customized files If you recolor the animation, the primary action changes to **Save and insert animation**. The app saves a new Workspace file first. Open the saved result and select **Insert animation** to continue. See [Recoloring an animation](/en/integrations/webflow/04_prepare/recoloring-an-animation) for the complete workflow. ## Related - [Inserting into Webflow](/en/integrations/webflow/05_insert-and-publish/inserting-into-webflow) - [Working with multi-animation files](/en/integrations/webflow/04_prepare/working-with-multi-animation-files)