Adding BMC icons to UI elements on forms by using Developer Studio

Developer Studio provides some predefined icons that are available Out-Of-The-Box (OOTB) for a Progressive Web Application (PWA). You can add an icon to a UI element on a form in Developer Studio. To know what icons are available to support PWA, see Previews-of-icons-available-in-Developer-Studio-to-support-PWA.

To add custom icons to the PWA screens, you must update the CSS mentioned in Rebranding Progressive Web Application screens.

To add a BMC icon to UI elements on forms by using Developer Studio

1. Copy an icon name from the list of categorized icons.
2. In Developer Studio, paste the icon name as the value for a property that supports icons. You must paste the icon name as it is.
3. View the form in PWA to see the icon. To know how to enable a PWA, see Enabling-Progressive-Views-for-forms-by-using-Centralized-Configuration-Settings.
   You can see that the icon is displayed on the form in PWA.

Example: Adding the d-icon-user_o icon

1. Copy the d-icon-user_o icon name from the list of categorized icons.
2. In Developer Studio, drag the Character field onto the form.
3. Paste the icon name as the value for the Default Thumbnail Image property.
   The Default Thumbnail Image property is one of the properties where you can use an icon name.
4. View the form in PWA to see the icon. To know how to enable a PWA, see Enabling-Progressive-Views-for-forms-by-using-Centralized-Configuration-Settings.
   You can see the d-icon-user_o icon () on the form in PWA. If you use the d-icon-user_circle icon name, you can see the person icon in a circle .