Skip to main content
Version: v11.6.2

Custom Icon Fonts

Custom Icon font families can now be imported into the studio using this feature. It can be imported in two ways.

  • Using the File Explorer
  • Using the Select Icon dialog

Using File Explorer​

  1. Go to File Explorer and click Import Resource to import a new icon family.

  1. Select the Icons tab in the Import Resource dialog.

  1. Upload the ttf and CSS files of the icon family and enter the library name. Click Save.

  1. Go to the Import Resource dialog to view the imported custom font family in the Icons tree.

  1. Go to a Page to drag and drop the Icon widget.

  1. Open the Select Icon dialog to view the uploaded icons family.

  1. Select the icon and click Apply.

  1. You can view the applied font in the studio.

Using Select Icon dialog​

  1. Drag and Drop the Icon widget. Go to the Select Icon dialog.

  1. Click Import Font Icon to open the Import Resources dialog.

  1. Upload the ttf and CSS files and enter the library name. Click Save.

  1. Go to the Import Resource dialog to view the imported custom font family in the Icons tree.

  1. Go to the Select Icon dialog to view the uploaded icons family.

  1. Select the icon and click Apply.

  1. You can view the applied font in the studio.

Deleting Icon Font Family​

  1. After uploading the ttf and CSS files of the icon family, click Save.

  1. Go to the Import Resource dialog to view the imported custom font family in the Icons tree.

  1. Click the Delete icon to delete the selected icon font family.