Package Exports

@animaliads/animalia-icon/Animalia.json
@animaliads/animalia-icon/fill
@animaliads/animalia-icon/fill/Animalia-Fill.svg
@animaliads/animalia-icon/fill/Animalia-Fill.ttf
@animaliads/animalia-icon/fill/Animalia-Fill.woff
@animaliads/animalia-icon/fill/selection.json
@animaliads/animalia-icon/fill/style.css
@animaliads/animalia-icon/index.js
@animaliads/animalia-icon/regular
@animaliads/animalia-icon/regular/Animalia.svg
@animaliads/animalia-icon/regular/Animalia.ttf
@animaliads/animalia-icon/regular/Animalia.woff
@animaliads/animalia-icon/regular/selection.json
@animaliads/animalia-icon/regular/style.css

Readme

Biblioteca de Ícones Animalia

Instalação 💾

Adicione a biblioteca de ícones Animalia ao seu projeto com o npm:

npm i @animaliads/animalia-icon

Uso 🚀

Nossos ícones funcionam como fontes da web, facilitando a inserção em seu site. Basta adicionar um arquivo ao seu documento e usar tags simples para exibir ícones nítidos e escaláveis em vários estilos.

<!doctype html>
<html>
  <head>
    <link
      rel="stylesheet"
      type="text/css"
      href="https://unpkg.com//@animaliads/animalia-icon@1.0.0/src/regular/style.css"
    />
  </head>
  <body>
    <i class="an an-smiley"></i>
  </body>
</html>

Nota: Você pode importar quantos pesos forem necessários. Apenas os pesos importados corresponderão e serão renderizados como ícones.

Pesos ✨

Os ícones Animalia vêm em 2 pesos: regular e preenchido. Para usar um peso, você deve incluir um link para sua folha de estilo e usar a classe de peso apropriada no ícone (o peso regular usa .an em vez de .an-regular):

Estilização 🎨

Ícones Animalia são essencialmente texto, então você pode estilizá-los com CSS como qualquer fonte. Personalize o font-size, color e muito mais para combinar com seu design.

Precisa de opções rápidas de dimensionamento? Temos tudo o que você precisa com estas classes auxiliares:

.an-xxs {
  font-size: 0.5em;
}
.an-xs {
  font-size: 0.75em;
}
.an-sm {
  font-size: 0.875em;
}
/* ...e mais! */

Evite sobrescrever font-family, font-style, font-weight, font-variant ou text-transform. Fazer isso pode quebrar os ícones e exibir caracteres incorretos.