Repolode
Enviar
tabler

tabler/tabler-icons

Conjunto gratuito de mais de 6.200 ícones SVG em uma grade 24x24, com licença MIT e pacotes para React, Vue, Svelte, Angular e outros.

Ver no GitHubSite
Estrelas
22,396
Forks
1,245
Issues abertas
85
Último commit
há 7 horas

O que é?

Tabler Icons é um conjunto de mais de 6.200 ícones SVG de código aberto, cada um desenhado em uma grade 24x24 com traço de 2px. Ele inclui estilos contornados e preenchidos, para que os desenvolvedores possam escolher um estilo visual consistente para interfaces web sem precisar desenhar os próprios ícones.

Os ícones são distribuídos em pacotes oficiais para diferentes formatos e frameworks. Você pode usar arquivos SVG, um sprite SVG ou uma webfont com CSS e SCSS, além de componentes prontos para React, React Native, Preact, Vue 3, Svelte 4 e 5, SolidJS, Astro e Angular. A espessura do traço e a cor podem ser ajustadas via CSS ou props dos componentes. Os ícones também estão disponíveis em uma CDN do jsDelivr.

Recursos principais

  • 01Mais de 6.200 ícones em estilos contornados e preenchidos, em uma grade 24x24.
  • 02Pacotes oficiais para SVG, sprite, webfont e formatos PNG/PDF/EPS.
  • 03Componentes para React, Vue, Svelte, SolidJS, Astro, Angular e React Native.
  • 04É possível ajustar a cor, o tamanho e a espessura do traço via CSS ou props.
  • 05Disponível pelo npm e por uma CDN do jsDelivr.

Casos de uso

  • Adicionar um conjunto consistente de ícones a uma aplicação web em React ou Vue.
  • Usar ícones como SVG inline ou imagens de fundo em CSS em um site estático.
  • Criar uma barra de ferramentas ou um menu de navegação com uma webfont.
  • Obter ícones vetoriais para trabalhos de design ou impressão nos formatos PNG, PDF ou EPS.

Início rápido

  1. 1

    Instale o pacote de ícones SVG com npm

    npm install @tabler/icons
  2. 2

    Instale o pacote de componentes React em vez dele (opcional, para projetos React)

    npm install @tabler/icons-react
  3. 3

    Importe um ícone no seu código e use-o; por exemplo, IconAward no React

Antes de usar

  • Oferece apenas conjuntos de ícones: fornece ícones, não uma biblioteca completa de componentes de UI.

Tópicos

#icons#svg#icon-font#react#vue#svelte#design-system#css#bootstrap-icons#components

Perguntas frequentes

O que é tabler-icons?
Conjunto gratuito de mais de 6.200 ícones SVG em uma grade 24x24, com licença MIT e pacotes para React, Vue, Svelte, Angular e outros. Tabler Icons é um conjunto de mais de 6.200 ícones SVG de código aberto, cada um desenhado em uma grade 24x24 com traço de 2px. Ele inclui estilos contornados e preenchidos, para que os desenvolvedores possam escolher um estilo visual consistente para interfaces web sem precisar desenhar os próprios ícones.
tabler-icons é gratuito? Qual é a licença?
tabler-icons é open source sob a licença MIT. Confira os termos da licença antes de usá-lo em produtos comerciais.
tabler-icons ainda é mantido?
Manutenção ativa. O último commit de tabler-icons foi em 21 de out. de 2026.
Para que posso usar tabler-icons?
Adicionar um conjunto consistente de ícones a uma aplicação web em React ou Vue. Usar ícones como SVG inline ou imagens de fundo em CSS em um site estático. Criar uma barra de ferramentas ou um menu de navegação com uma webfont. Obter ícones vetoriais para trabalhos de design ou impressão nos formatos PNG, PDF ou EPS.
Como instalar tabler-icons?
Instale o pacote de ícones SVG com npm: npm install @tabler/icons Instale o pacote de componentes React em vez dele (opcional, para projetos React): npm install @tabler/icons-react Importe um ícone no seu código e use-o; por exemplo, IconAward no React
Onde consigo tabler-icons?
O código-fonte e as instruções de instalação estão no GitHub: https://github.com/tabler/tabler-icons

Resumo gerado por IA a partir do README do projeto. As estatísticas do GitHub são atualizadas diariamente.

Projetos relacionados