LiveDemo - Open-source alternative to Storylane, Navattic, and Arcade | Product Hunt

How To Duplicate A Component In Webflow



How To Duplicate A Component In Webflow: step-by-step guide

  1. Locate the place you wish to insert a copy of your component.

  2. Open the Components menu from the left sidebar menu.

  3. Hover over the component you wish to duplicate and drag it out to where you wish to place it.

  4. This will insert an instance of your component at the location. This instance will still be linked to your component, any changes made to this will also reflect on all other instances.

  5. If you wish to only duplicate and use as a copy separately, right click on the instance to open a menu and select Unlink Instance from the bottom.

  6. Your element is no longer connected or linked to the component as an instance. Any changes made to this will not reflect on any other instances.

  7. You've now made a linked and an unlinked copy of a component in Webflow.

Quick answer: To duplicate a component in Webflow, locate your insertion point, open the Components menu from the left sidebar, and drag the desired component into place. To create an unlinked copy, right-click the inserted instance and select Unlink Instance from the menu.

About this Webflow tutorial

Create linked or unlinked component copies in Webflow by dragging from the sidebar and unlinking instances when needed. This guide shows how to duplicate A Component In Webflow in 7 steps, starting with "Locate the place you wish to insert a copy of your component" and finishing with "You've now made a linked and an unlinked copy of a component in Webflow". The interactive demo above is a click-through copy of the real Webflow interface, so you can rehearse each step before doing it in your own account.

Frequently asked questions

How many steps does it take to duplicate A Component In Webflow?

7 steps. Each one is listed in order above, and the demo highlights exactly where to click.

Can I try it without changing my own account?

Yes. Clicking through the demo doesn't touch your Webflow data or settings. Once you know the flow, repeat it in your own workspace.

This tutorial is filed under Webflow. Related guides: How To Duplicate A Page In Webflow, How To Edit Code In Webflow and How To Edit Components In Webflow. Last reviewed 05 Oct 2026.

LiveDemo - Open-source alternative to Storylane, Navattic, and Arcade | Product Hunt
🚀

Create your first interactive demo in minutes

No credit card required • Start building today

Start free→

This website uses cookies to enhance the user experience.

AcceptDecline