
We must make those variables available to the template. Notice that we are using : to bind variables instead of plain values, it’s important. The current disadvantage is that it is more tedious to use these icons than their webfont counterpart. No need for including equivalent webfonts from or CDN.

Better app footprint – only used icons will be included in the final build (treeshaking in action).There are many advantages of using only svg icons in your website/app: Go to Bootstrap Icons, look for your desired icon.Icon names are in hyphen-separated case and always begin with “bi-” prefix.Go to Line Awesome, look for your desired icon, click on it.Icon names are in hyphen-separated case and always begin with “la” prefix.Go to Themify, look for your desired icon.Icon names are in hyphen-separated case and always begin with “ti-” prefix.“attach-outline”), prefix it with “eva” and the result is “eva-attach-outline”. Go to Eva Icons, look for your desired icon, click on it.Icon names are in hyphen-separated case and always begin with “eva-” prefix.Also,they no longer do Material or IOS variants. Note: Starting with v5, Ionicons no longer supplies a webfont.Based on the variant that you want (auto-detect platform, material or iOS), you’d get the result: ion-square-outline or ion-md-square-outline or ion-ios-square-outline.

At the bottom of the page there will appear a popup. Go to Ionicons (v6) or Ionicons (v4), look for your desired icon, click on it.Icon names are in hyphen-separated case and always begin with “ion-”, “ion-md-”, “ion-ios-” or “ion-logo-” prefixes.Note: fas, far, fab, fal, fat and fad are deprecated and may not be available in future major versions).The result is fa-solid fa-flag (you can also use fas fa-flag). Below the icon name (as title), you will see something like.


