nataicons

Nataïcons

Une icône open source simple sur le thème amusant des gens de Natatoko.

---

Installation

Installer avec NPM

npm install nataicons

Usage

En ligne

Copiez les SVG que vous souhaitez utiliser à partir icons/24x24 ou icons/20x20 dans node_modules/nataicons et les insérer dans votre HTML.

 < svg xmlns =" http://www.w3.org/2000/svg " width =" 24 " height =" 24 " fill =" none " viewBox =" 0 0 24 24 " >
  < path stroke =" currentColor " stroke-linecap =" round " stroke-linejoin =" round " stroke-width =" 2 " d =" M3.5 14l8.515-11v6.5H21L12.015 21v-7H3.5z " />
</ svg >

Svg sprite

Incluez une icône sur votre page avec le balisage suivant:

 < svg width =" 24 " height =" 24 " class =" custom-class " >
  < use xlink:href =" #24x24--alarm " > </ use >
</ svg >

Vue

1. Installer avec NPM

npm install @nataicons/vue

2. Importer les composants icônes

 import { AlarmIcon , AlertIcon , NataIcon } from "nataicons/vue"

3. Utilisez les composants de l'icône dans votre modèle

 < template >
  < div >
    < AlarmIcon color = "red" size = "24" />
    < NataIcon name = "bell" color = "blue" size = "32" />
  </ div >
</ template >
< script >
  import { AlarmIcon } from "nataicons/vue"
    export default {
    components : { AlarmIcon }
  }
< / script>

Vous pouvez définir une size personnalisée (en pixels) ou utiliser les tailles par défaut (24px ou 20px). Le color Prop vous permet de modifier la couleur de l'icône.

Réagir

1. Installer avec NPM

npm install @nataicons/react

2. Importer les composants icônes

 import { AlarmIcon , NataIcon } from "@nataicons/react"

3. Utilisez les composants de l'icône dans votre JSX

 function MyComponent ( ) {
  return (
    < div >
      < AlarmIcon color = "red" size = { 24 } />
      < NataIcon name = "bell" color = "blue" size = { 32 } />
    </ div >  
  )
}

Semblable à Vue, vous pouvez définir une size personnalisée (en pixels) ou utiliser les tailles par défaut. Le color Prop vous permet de modifier la couleur de l'icône.

Inspiration

1. Vue-Hero-Icons
2. radix-iconcs
3. Héroïcènes

Licence

Nataicons est autorisé sous la licence du MIT. En bref, vous êtes libre d'utiliser ces icônes dans tout travail personnel, open-source ou commercial. L'attribution est facultative mais appréciée.