# Icon Collections
From the Settings Tab, you can browse available Icon Collections and add a custom collection which may be visualised and deleted.
* In the Dashboard, open Cwicly Settings.
* Open the Icon Collections tab.
## Available Icon Collections
You can browse the Available Icon Collections from here.
By default these are Font Awesome, Phosphor light, Phosphor Regular, Phosphor Duotone.
{% hint style="info" %}
Default collections cannot be deleted.
{% endhint %}
### Font Awesome
Font Awesome is the world's most popular icon set and toolkit.
### Phosphor Light
Phosphor is a light flexible icon family for interfaces, diagrams, presentations and other applications.
### Phosphor Regular
Phosphor is a regular flexible icon family for interfaces, diagrams, presentations and other applications.
### Phosphor Duotone
Phosphor Duotone icons allow you to display two tones or apply two colours by using two layers on the icon, one primary and one secondary.
## Add Icon Using IcoMoon
Custom Icon Collections can be added to complement the default collections.
{% hint style="info" %}
Default Icon Collections cannot be deleted.
{% endhint %}
{% hint style="info" %}
To prepare your collection of custom icons, Cwicly recommends using IcoMoon.
{% endhint %}
* Go to the [IcoMoon app](https://app.tango.us/app/workflow/How-to-Create-and-Upload-Custom-Icons-using-IcoMoon-0468345a5e274a6f84f5d6292f34f8ed).
* Click on *Import icons* or drag the icons from your folder to the IcoMoon app.
* Once uploaded, Select the icons you wish to use.
* Click on *Generate SVG & More.*
* Change the name of the icons if you want.
* Click on the :icon-gear: icon next to the *Download* button.
* Enter the name of the icon collection.
* Check the *Add `` to definitions in symbol-defs.svg* property.
* Click and Download the created collection.
Once downloaded, the icon collection you have created will appear as a .zip folder.
Open the folder and find the symbol-defs.svg file. Rename it to a suitable name.
### Add
* Open the Icon Collections panel.
* Enter the desired Icon Collection Name in the Collection Name field.
<figure><img src="https://3250709389-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MS33S0eoYwMaMrLb7T_%2Fuploads%2FNmoz5bSah9IxK6vWjihl%2FScreenshot%202023-08-23%20at%2011.55.37.png?alt=media&token=cdd9465b-6c5c-420e-98b7-a0580aba9050" alt=""><figcaption></figcaption></figure>
* Choose the .svg file downloaded from IcoMoon.
* Click Upload.
<figure><img src="https://3250709389-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MS33S0eoYwMaMrLb7T_%2Fuploads%2FTWAa6OBGqyPCiqiRu3TC%2FScreenshot%202023-08-23%20at%2012.08.53.png?alt=media&token=fb115229-dc4e-4fb3-ab49-b2819ca3de1f" alt=""><figcaption></figcaption></figure>
The Custom Icon collection will appear in the Icon Collections tab of the Settings tab.
<figure><img src="https://3250709389-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MS33S0eoYwMaMrLb7T_%2Fuploads%2FMg0gV9vqCFOwSpqx8EIm%2FScreenshot%202023-08-23%20at%2012.09.27.png?alt=media&token=19fad31b-f506-428e-a6ee-c8a674e1d6cc" alt=""><figcaption></figcaption></figure>
### Remove
* Open the Icon Collections panel.
* Find the Icon Collection you wish to remove.
* Click Delete.
<figure><img src="https://3250709389-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MS33S0eoYwMaMrLb7T_%2Fuploads%2FysR6WLrJZYKqqoH4WABu%2FScreenshot%202023-08-23%20at%2012.10.09.png?alt=media&token=ec98792f-6a8e-4c64-b8fd-cd9d032e9c64" alt=""><figcaption></figcaption></figure>
