The Polymer iron-icon element is used to display a single icon. Its default icon size is 24 px.
It is displayed as:
The following code shows how to set the size of an icon.
There are various set of icons in the iron elements. You have to import the iron-icons.html file in your index file for default set of icons and use the icon attribute as shown in the following command to define an icon.
We can also use different built-in set of icons by importing iron-icons/<iconset>icons.html file and define the icon as <iconset>:<icon>.
Example: Code for a communication icon
We can also create custom item and use it:
Let's see the custom properties used for styling:
To use the iron-icon element, navigate to your project folder in the command prompt and use the following command -
The following example demonstrates the use of iron-icon element: