Nuxt 3 feather Icons
npm install nuxt-feather-iconsSupport for Nuxt 3
[![npm version][npm-v-src]][npm-v-href]
[![GitHub License][license]][license-href]
[![npm downloads][npm-d-src]][npm-d-href]
[![Nuxt nuxt-feather-icons][nuxt-src]][nuxt-href]
[![Static Badge][sponsor-src]][sponsor-href]
``bash`
npx nuxi@latest module add nuxt-feather-icons
` js`
modules: [
'nuxt-feather-icons'
],
Icons are automatically sized based on the font size of the parent element by default.
However, if you wish to customize the size, you can use the size attribute. For sizing based on multiples, specify the
desired multiple followed by an x.
`html
`
Additionally, you can set an absolute size in pixels (px) by simply passing an integer.
`html
`
This flexibility allows you to easily adjust the icon size according to your specific needs.
`html
``
Use the resolveComponent function to dynamically load icon components. In the template, leverage the
This approach simplifies the creation of dynamic and reusable icon lists, making it ideal for menus or other components requiring flexibility with multiple icons.
[npm-v-src]: https://img.shields.io/npm/v/nuxt-feather-icons/latest.svg?style=flat-square&colorA=18181B&colorB=28CF8D
[npm-v-href]: https://www.npmjs.com/package/nuxt-feather-icons
[license]: https://img.shields.io/github/license/4sllan/nuxt-feather-icons?style=flat-square&colorA=18181B&colorB=28CF8D
[license-href]: https://github.com/4sllan/nuxt-feather-icons
[nuxt-src]: https://img.shields.io/badge/Nuxt-18181B?logo=nuxt.js
[nuxt-href]: https://nuxt.com/
[npm-d-src]: https://img.shields.io/npm/dt/nuxt-feather-icons.svg?style=flat-square&colorA=18181B&colorB=28CF8D
[npm-d-href]: https://www.npmjs.com/package/nuxt-feather-icons
[sponsor-src]: https://img.shields.io/badge/-%E2%99%A5%20Sponsors-ec5cc6?style=flat-square
[sponsor-href]:https://github.com/sponsors/4sllan