Pixelstrap - Admin Document

Icons

Font awesome Offical link Preview link

You have to add the following style and add font-awesome folder in your fonts folder

<!-- font awesome css -->
@import "./fontawesome-icon/fontawesome-icon";

<!-- some icon display for demo -->
<i class="fa-brands fa-bluetooth-b fa-fw mx-1"></i>
<i class="fa-solid fa-bitcoin-sign fa-fw mx-1"></i>
<i class="fa fa-anchor mx-1"></i>
<i class="fa fa-text-height mx-1"></i>

Iconly Icon Offical link Preview link

You have to add the following style and add ico folder in your fonts folder

<!-- Iconly Icon css -->
@import "./iconly-icon/iconly-icon";

<!-- some icon display for demo -->
<i class="icofont icofont-bow mx-1"></i>
<i class="icofont icofont-dolphin mx-1"></i>
<i class="icofont icofont-brand-apple mx-1"></i>
<i class="icofont icofont-bank-alt mx-1"></i>

To use another types of Iconly Icons you have to refer below template link

Preview Page: https://admin.pixelstrap.net/admiro/template//ico-icon.html

Themify Offical link Preview link

You have to add the following style and add themify folder in your fonts folder

<!-- themify icon css -->
@import "./themify.scss";

<!-- some icon display for demo -->
<i class="icon-fullscreen mx-1"></i>
<i class="icon-save-alt mx-1"></i>
<i class="icon-volume mx-1"></i>
<i class="icon-instagram mx-1"></i>

Feather icon Offical link Preview link

You have to add the following style and add feather folder in your fonts folder

npm i vue-feather

In your main.ts file all the following code:

import VueFeather from "vue-feather";
  .component(VueFeather.name, VueFeather)

<!-- some icon display for demo -->
  <vue-feather type="activity" class="mx-1"></vue-feather>
  <vue-feather type="image" class="mx-1"></vue-feather>
  <vue-feather type="phone-forwarded" class="mx-1"></vue-feather>
  <vue-feather type="wind" class="mx-1"></vue-feather>