Hey kalyanam,
I guess, by icons you mean glyphicons, so
You can extend your set of glyphicons by importing fontAwesome libraries in your custom SASS directory.
A little documentation about how to set this up:
https://fontawesome.com/v4.7.0/get-started/
and
https://fontawesome.com/how-to-use/on-the-web/using-with/sass
Then, after implementing the needed parts in your project directory, you can just use classess on page elements to display various icons, for instance; you can add an empty container with the following classess:
fas fa-medkit fa-lg
Which will display the following one: https://fontawesome.com/icons/medkit?style=solid
(Note that the fa-lg class isn't actually needed, it just sets the size of the icon)
Edit: Also, when you want to display a specific icon before a text on your navigation items, consider adding a class to the text in button and using the :before selector.
See also: https://www.w3schools.com/cssref/sel_before.asp
hope it helps!
If you want to use Font Awesome for your icons, have a look at the Font Awesome module in the Mendix Marketplace.
https://marketplace.mendix.com/link/component/119189
Once you’ve added the module, you can apply the classes directly to containers. For example, adding classes fas
and fa-plus
to an empty Mendix container. You should see the plus icon appear when you run the project.
The module also allows you to override the default Glyphicons in your application.
If you need greater flexibility, Jason has written a very comprehensive blog post comparing the various methods of adding icons (icon-fonts, CSS icons, SVGs, and PNGs) to your Mendix application.
https://medium.com/mendix/the-complete-guide-to-icons-and-mendix-426936a533ee
Hope this helps.