# Add HMI Components

Once you have created a [new HMI panel](https://docs.robpod.cloud/hmi-designer/design-steps/create-new-hmi-panel), you can start adding **HMI Components** to it.

**HMI Components** are the basic User Interface elements that will compose your HMI panel.

Use the **Palette Toolbar** to add new HMI components to the panel.

<figure><img src="https://175138337-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fvxlh3prlGsBGF30oqbYW%2Fuploads%2FeMol1nPfDwvbgEMtnCEU%2Fhmi-palette-toolbar.png?alt=media&#x26;token=22999f4a-8112-475e-ba6d-5fc93831b7ec" alt=""><figcaption></figcaption></figure>

Click on a HMI Components **to move it or change its size.**

<figure><img src="https://175138337-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fvxlh3prlGsBGF30oqbYW%2Fuploads%2F1gTwtnwqrAMMHuEMRosT%2Fhmi-resize.png?alt=media&#x26;token=58dd9d47-01c2-44b3-8e03-22e34a3b43f4" alt=""><figcaption></figcaption></figure>

You can view and [edit the properties](https://docs.robpod.cloud/hmi-designer/design-steps/edit-hmi-components) of the selected HMI Component on the **side tool window.**

<figure><img src="https://175138337-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fvxlh3prlGsBGF30oqbYW%2Fuploads%2FcnH8JRIaDf46E1oWquH4%2Fhmi-sidebar.png?alt=media&#x26;token=5aedd100-a215-44a4-a3ae-5332bb5642d8" alt=""><figcaption></figcaption></figure>

Each HMI components has is own characteristic properties that determines how it looks and how it will interact with the robot program. Have a look a the [HMI components list](https://docs.robpod.cloud/hmi-designer/hmi-components) to check properties of each element.
