---
title: "Work with components"
slug: "work-with-components"
abstract: "Create, move, and delete components in the Component builder."
---

# Work with components

In the Component builder, you can prototype components and store them grouped in collections.

![Screenshot of the Components library](https://doc.sitecore.com/api/markdown-image/sai/en/users/sitecoreai/images/Docs_Page_6.png)

## Create a component

To create a component:

1. To create a new collection where to store your component, click **Add collection**. If you already have the collection you need, proceed to step 2.
2. In the top right corner of the UI, or in the collection of your choice, click **Add component**.
3. In the left-hand pane, name your component and add a description. In the drop-down menu, click the collection where you want to save your component.
4. Click **Save**.

The new component is added to the collection. 

You can use the **Actions** menu :mdiDotsHorizontal: to edit the details of the component (collection, name or description) or to open the component and its versions in the Component builder.

## Duplicate a component

When you duplicate a component, you create an exact copy of the component, including all specific versions and responsive bundles that belong to it.

To duplicate a component:

- In the Component builder, on the component thumbnail, click **Actions** :mdiDotsHorizontal:, and click **Duplicate**.

The duplicated component is saved in the same collection as the original one.

## Move a component to another collection

To move a component to a different collection:

1. In the Component builder, on the component thumbnail, click **Actions** :mdiDotsHorizontal:, and click **Edit component**.
2. In the right-hand pane, select an existing collection from the drop-down menu.
3. Click **Save**.

## Delete a component

A deleted component is only deleted if all of its versions are in the draft state. A component with at least one staged or published version is only archived and can be restored.

To delete a component:

- In the Component builder, on the component thumbnail, click **Actions** :mdiDotsHorizontal: and click **Delete**. 

## Delete a collection

Deleting a collection deletes all the components of that collection.

To delete a collection:

- In the Component builder, to the right of the collection name, click **Actions** :mdiDotsHorizontal:, and click **Delete**.

## Rename a collection

To rename a collection:

1. In the Component builder, click **Actions** :mdiDotsHorizontal: to the right of the collection name, and click **Edit details**..
2. In the **Name** field, edit the name of the collection.
3. Click **Close**.