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 scss -->
@import "./vendors/font-awesome.scss";
<!-- some icon display for demo -->
<i class="fa fa-bluetooth mx-1"></i>
<i class="fa fa-bitcoin 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 scss -->
@import "./vendors/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>
Nuxt icon Offical link Preview link
You have to add the following style and add feather folder in your fonts folder
npm install --save-dev nuxt-icon
export default defineNuxtConfig({
modules: ['nuxt-icon']
})
<!-- some icon display for demo -->
<Icon name="material-symbols:browse-activity-rounded" class="mx-1"></vue-feather>
<Icon name="material-symbols:broken-image-outline" class="mx-1"></Icon>
<Icon name="lucide:phone-forwarded" class="mx-1"></Icon>
<Icon name="ph:wind-bold" class="mx-1"></Icon>