The Icon component is a visual indicator to show a small image or a symbol.

You can use the Icon component to let the users quickly understand the meaning of the text. Or maybe you intend to display an icon based on your app designs.

You can pick an icon from the available list of icon sets:

Adding an Icon component

To add an icon to your app screen:

  • Select the Icon component from the Components drawer. You can open the list of components by clicking the + button next to Components.
  • To add an Icon, go to the Configs tab (second tab) in Properties Panel.
  • Open the Icon picker next to the Icon config property and select the desired icon.

Configuration Properties

Component NameTo alter the name of the component. The name is reflected in the Components tree. Defaults to Icon.
ColorThe colour of the icon. Defaults to strong.
SizeThe width and height of the icon. Defaults to 24.

Data Configuration

IconThe icon is selected from the icon picker. Defaults to photo.


Note: For Interactions, use Icon Button

If you are looking to add actions on an Icon or make it interactable, check Icon Buttons component.