Font icons

Tron icludes 900+ font based icons - a combination of FontAesome and Flaticon Material Design Pack.


Flaticon Material Design Pack includes 423 icons in font format made by Google Inc.

For more information and list of available icons please see Flaticon pack demo page.


FontAwesome is the iconic font and CSS toolkit that gives you 479 scalable vector icons that can instantly be customized - size, color, drop shadow, and anything that can be done with the power of CSS.

For more details and list of available icons please visit FontAwesome official website.

How to use

For performance reasons, all icons require a base class and individual icon class. To use, place the following code just about anywhere. Be sure to add extra classes .left-aligned or .right-aligned for proper spacing.

Use .icon-left and .icon-right classes on .btn for better icons alinghment inside buttons.

// Flaticon

// FontAwesome



Use them in buttons, button groups for a toolbar, navigation, or prepended form inputs.



Toggleable, contextual menu for displaying lists of links. It requires dropdown JavaScript plugin. Please follow the link to read more from official Bootstrap documnetation.

Wrap the dropdown's trigger and the dropdown menu within the

wth .dropdown class.

By default, a dropdown menu is automatically positioned 100% from the top and along the left side of its parent. Add .dropdown-menu-right to a .dropdown-menu to right align the dropdown menu.


Add a header to label sections in any dropdown menu.


Add .disabled to a

  • in the dropdown to disable the link.

  • Button groups

    Group a series of buttons together on a single line with the .button group.

    Basic example

    Wrap a series of buttons with .btn in .btn-group.



    Instead of applying button sizing classes to every button in a group, just add .btn-group-lg, .btn-group-sm or .btn-group-xs to the .btn-group.



    Place a .btn-group within another .btn-group when you want dropdown menus mixed with a series of buttons.

    Vertical variation

    Make a set of buttons appear vertically stacked rather than horizontally.


    Justified button groups

    Make a group of buttons stretch at equal sizes to span the entire width of its parent. Also works with button dropdowns within the button group.

    Just wrap a series of .btns in .btn-group.btn-group-justified.

    For .btn-outlined add .btn-group-outlined to nesting .btn-group in order to remove left border.


    To use justified button groups with