# Layers

### 1. Shape Layers

* **Go to the Editor Page:** Open your HIVO account and navigate to the Editor page where you are working on your content.
* **Click the Layers Icon:** On the right side of the Editor page, find and click the “Layers” icon.

<figure><img src="https://2446612760-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F0sjg5GpIPr5HzBTJYqYe%2Fuploads%2FFAKN0kwQoumiwf9dJaw2%2FLayers.png?alt=media&#x26;token=969c7129-b489-4474-970a-7e90e1fe4df4" alt=""><figcaption></figcaption></figure>

* **View Shape Layers:** After clicking the Layers icon, you will see all the shape layers available in your project.

<figure><img src="https://2446612760-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F0sjg5GpIPr5HzBTJYqYe%2Fuploads%2FjbGjzqbbgD7I77QNEnc3%2Fshapes.png?alt=media&#x26;token=15ceaa6a-6a5a-4a24-b292-1eee87f55052" alt=""><figcaption><p>Shape Layers</p></figcaption></figure>

### 2. Image Layers

* **Go to the Editor Page**: On your HIVO account, navigate to the Editor page.
* **Click the Layers Icon:** On the right side of the Editor page, click the “Layers” icon.

<figure><img src="https://2446612760-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F0sjg5GpIPr5HzBTJYqYe%2Fuploads%2FdxC0eTzXELi6lVu3DJZq%2FImage1.png?alt=media&#x26;token=ec722857-2e00-47d3-b207-0570fbfa8bb7" alt=""><figcaption></figcaption></figure>

* **Add an Image Layer**: In the right-side panel, click the "Add Image" option. You can then select an image from the Library, paste a URL, or choose an image from Unsplash.

<figure><img src="https://2446612760-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F0sjg5GpIPr5HzBTJYqYe%2Fuploads%2F1o2mJUYn6HGIl5zJKIlQ%2FImage2.png?alt=media&#x26;token=cd405d2e-ca4d-44ce-9d22-0968b3f6d9bd" alt=""><figcaption><p>Image Layer</p></figcaption></figure>

### 3. Group Layers (Slot)

#### 🔹 How to Group Layers

Effective use of Groups not only keeps your design organized but is also a prerequisite for enabling seamless data drag-and-drop and automated bulk mapping.

* Step 1: **Hold the Shift key** and click to select the layers you wish to group.
* Step 2: **Right-click** on the selection and select Group Layers.

<figure><img src="https://2446612760-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F0sjg5GpIPr5HzBTJYqYe%2Fuploads%2Fw5tuh1Q3W97KzMAY581y%2FGroup%20823.png?alt=media&#x26;token=b6363c32-f810-4f73-9263-2c06a2099829" alt=""><figcaption></figcaption></figure>

#### 🔹 How to Ungrouping & Removing Layers

* **To Ungroup:** Right-click on the Group and select Ungroup.
* **To Remove a Layer from a Group:**
  * Select one or more layers inside the group (using Shift).
  * Right-click and select Remove. The layer will be moved out of the group's hierarchy while maintaining its visual position on the canvas.

<figure><img src="https://2446612760-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F0sjg5GpIPr5HzBTJYqYe%2Fuploads%2FLJfP3AJOtmnRiw7az4nA%2FGroup%20824.png?alt=media&#x26;token=ce642d71-2efa-4cfa-abf4-6afbb31570fb" alt=""><figcaption></figcaption></figure>

Using Layers makes it easier to organize and control different parts of your design. It lets you change specific pieces on their own, allows team members to work together at the same time, and makes it simpler to update and reuse parts of your design.
