> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.teleporthq.io/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# How to use and customize Icons

**Here's how to customize the free icons from the TeleportHQ assets manager.**

|    |    |    |
| --- | --- | --- |
| [Icons section](#2-icons-section) | [Customize icons in the Visual editor](#2-customize-icons-in-the-visual-editor) | [Customize icons in the Advanced editor](#2-customize-icons-in-the-advanced-editor) |

## Icons section

The last section of the Assets manager contains Icons. Here you will over 30 categories of icons that you can use to create your website or UI. The icons are SVG files that you can easily customize to fit with your personal brand.

![Assets manager overview](https://storage.crisp.chat/users/helpdesk/website/60c4bca58bb99c00/assets-manager_18ok96h.gif)

As the icons from the assets manager are **SVG** (Scalable Vector Graphics) files this means that you can change some of the properties. To start customizing an icon inside of your project:

* **Select the icon** in the **canvas**
* Go to the **Right side panel**.

Here you will find several options:

## Customize icons in the Visual editor

In the **Right panel**, in the **Background** section you can change the **fill** property. That will change the inner color of your icon. With the visual editor you can also change other properties such as border, radius or shadow.

![Editing icons in the visual editor](https://storage.crisp.chat/users/helpdesk/website/60c4bca58bb99c00/1-visual-editing_1yqlpzr.gif)

## Customize icons in the Advanced editor

In the Properties section of the **Advanced panel** you can also add other properties such as the outer background of the icon. These can be set in the **Visual tab** as well.

![Editing icons in the advanced panel](https://storage.crisp.chat/users/helpdesk/website/60c4bca58bb99c00/2-advanced-editing_7swzjy.gif)