Anastasia Ovchinnikova

Siga

Abr 5, 2020 · 13 min de leitura

Os ícones têm um papel importante em dar-lhe a primeira impressão do site ou aplicativo de interface. Mas é preciso muito tempo e dinheiro para desenvolvê-los do zero., A utilização de ícones no seu site permite-lhe comunicar eficazmente com os seus visitantes: eles aumentam a legibilidade, realçam conteúdos importantes, restabelecem funcionalidades ou funcionalidades e melhoram o design. Portanto, vale a pena prestar atenção aos melhores pacotes de ícones prontos.

além disso, quando se trata de ícone do design, esta é uma ótima maneira de mostrar o designer de qualificações., Um pacote de ícones doce e agradável é uma vitrine perfeita do trabalho do designer e um instrumento poderoso para construir a sua reputação on-line.

Aqui estão alguns grandes prós de usar ícones em seu próximo projeto de design UX.os ícones ajudam a aumentar a legibilidade do site ou do aplicativo.os ícones bem feitos ajudam a reduzir o volume de texto. Usar ícones torna a sua mensagem compreensível sem texto.os ícones podem adicionar personalização ao seu produto.os ícones podem ser um bom ponto de partida para conhecer o produto.,

  • Por último, mas não menos importante: uma das funções mais importantes dos ícones é ajudar os usuários intuitivamente a entender a aplicação tanto no primeiro conhecimento quanto durante o uso subsequente.
  • neste artigo, encontrará uma colecção de alguns dos melhores pacotes de ícones que pode usar no seu website ou negócio, mesmo que não seja um artista criativo. Os produtos apresentados neste artigo podem ser utilizados não só em sites comuns e em casos básicos, mas também em sites mais complexos e especializados.dividimos os produtos em várias categorias para sua facilidade., Antes das descrições você verá a categoria A que este produto pertence.

    • conjuntos de ícones livres.mercados. O mercado contém ícones de diferentes fabricantes. Aqui você pode encontrar tanto barato e caro, bem como produtos de boa e baixa qualidade.
    • conjuntos de ícones do desenho do Material e conjuntos de ícones planos.
    • conjuntos de ícones CSS. Os ícones CSS são feitos usando-guess what-CSS. Para usá-los, basta copiar o código para a sua página.tipos de letra
    • ícones. De acordo com Pluralsight, as fontes de ícones são fontes reais que contêm símbolos e glifos em vez de letras ou números., Eles são populares para web designers, uma vez que você pode classificá-los com CSS da mesma forma que texto regular. Os tipos de letra Icon são tratados como texto pelos navegadores, por isso terá de os normalizar para evitar problemas de anti-aliasing de texto, e são suportados em quase todos os navegadores.ícones de
    • SVG. Scalable Vector Graphics (SVG) é um formato vetorial baseado em XML que pode escalar para qualquer tamanho sem perder clareza. Eles podem ser exibidos através do uso de CSS, tags de objetos, tags de imagem, ou alinhados diretamente em seu HTML.conjuntos de ícones do glifo e pictograma.,

    Flaticon

    fonte da Imagem: https://www.flaticon.com/packs

    Flaticon contém completamente em vetores editáveis e podem ser usados tanto para o pessoal e projetos comerciais. O FlatIcon tem mais de 2,3 milhões de ícones vetoriais agrupados em 51202 pacotes.

    O produto tem extensão Adobe que lhe permite importar facilmente ícones dentro do Photoshop, Illustrator, e após efeitos., Se você gostaria de usar um tipo de letra web em vez de arquivos estáticos para seus ícones, o FlatIcon irá cuidar da conversão de formato e gerar um tipo de letra web pronto para usar. Você também pode personalizar ícones baixados.

    key facts:

    • mais de 90 000 ícones;
    • SVG, EPS, PSD e PNG formatos;
    • Tipos de letra icon;

    • Adobe Extensão Para Cc suite;
    • licença Linkshare com opções premium; e
    • novos pacotes de ícones são adicionados todos os meses.,

    uma assinatura premium com a FlatIcon irá fornecer-lhe todos os direitos de licenciamento, acesso a conteúdo exclusivo, sem anúncios, macOS app e Adobe extensões, bem como a capacidade de criar coleções ilimitadas.,

    Jam Icons

    Web-site: https://jam-icons.com/
    Format and Type: SVG, CSS
    Price and License: Free, MIT

    Image source: https://jam-icons.com/

    Jam icons are a set of 896 handcrafted icons. This icon pack comes with both SVG and font versions. The icons can be used as SVG files in your web, print or application development projects., Os ícones também podem ser usados como um tipo de letra com as folhas de estilo CSS dadas. Existem tamanhos 16px, 24px e 32px. Você também pode optar por preencher ou remover ícones.

    Fontisto Ícone Pack

    site: https://fontisto.com/
    Formato e Tipo: CSS
    Preço e de Licença: Grátis, MIT

    fonte da Imagem: https://fontisto.com/

    Fontisto é um vetor pacote de ícones., Ícones podem ser personalizados instantaneamente: tamanho, cor, sombra drop e qualquer coisa que pode ser feito com o poder do CSS. O produto não requer Javascript. Os ícones Fontisto são vetores, o que significa que ficarão bem nos monitores de alta resolução.

    no site, você pode encontrar documentação completa e vários guias sobre como iniciar e personalizar o produto. Você pode começar a usar o produto simplesmente colando o link em seu site. Além disso, você pode usar Fontisto com os gerentes de pacotes que são certos para você: npm, fio, bower, etc.,

    Iconmonstr

    site: https://iconmonstr.com/
    Formato e Tipo: SVG, EPS, PSD e PNG, o Mercado
    Preço e Licença: Livre

    fonte da Imagem: https://iconmonstr.com/

    Iconmonstr coleção de ícones tem 4400+ ícones. Cada conjunto de ícones oferece tanto esboços e versões cheias dos gráficos para garantir que eles podem ser usados para uma variedade de aplicações de design., Cada ícone neste site está disponível gratuitamente, e os arquivos icon vêm em formatos como SVG, AI, PSD e PNG. Os arquivos podem ser usados para fins comerciais e gratuitos.

    Iconmonstr torna simples procurar ícones através da sua poderosa função de pesquisa. Você pode até mesmo salvar seus ícones favoritos em uma coleção pessoal para uso futuro.

    características Principais:

    • uso livre de todos os ícones,
    • Quatro opções de download formato, e
    • ícones de tamanho reduzido optimizados para uso web.,

    Pixsellz Material Ícones Biblioteca

    fonte da Imagem: https://icons.pixsellz.io/

    Um enorme pacote de mais de 1000 ícones divididos em 16 categorias diferentes. O pacote livre de ícones é inspirado pelo design do Material e apresentado em três estilos visuais diferentes — arredondado, contorno e dois tons., O conjunto está disponível em 6 formatos de arquivo diferentes, para que você possa usar os ícones em seu software de design preferido.

    características-Chave:

    • 3 estilos,
    • Figma estilos,
    • 1000+ ícones,
    • 24×24 pixels,
    • Sketch estilos e símbolos,
    • 16 categorias, e
    • 6 formatos de arquivo.

    Entypo

    Web-site: http://www.entypo.com/
    Format and Type: SVG
    Price and License: Free, Creative Common License 4.,0

    fonte da Imagem: http://www.entypo.com/

    Entypo é um ícone svg pacote família, cuidadosamente trabalhada há alguns anos atrás por Daniel Bruce na Suécia. Estes ícones são soberbos: quando se trata de freebies, eles estão no topo da linha. O produto vem como SVG com 411 ícones, livre com uma licença Creative Commons.,

    O autor diz que construir uma fonte leva muito tempo e é melhor gastar tempo no desenvolvimento de novos pictogramas.

    o Mal Ícones

    site: https://evil-icons.io/
    Formato e Tipo: SVG, Esboço
    Preço e de Licença: Grátis, MIT

    fonte da Imagem: https://evil-icons.io/

    Este pack é absolutamente enorme e ele vem com tudo — incluindo SVGs e os arquivos de origem., Isso significa que você pode baixar SVGs junto com arquivos para o Illustrator e o .esboços para esboços.

    cada ícone segue o estilo da linha fina e eles são perfeitos para a maioria dos sites. O fato de que você pode editar a fonte original torna-os ainda mais valiosos.,

    Streamline Icons

    Web-site: https://streamlineicons.com/
    Format and Type: ICONJAR, SKETCH, FIG, XD, SVG, AI, PDF, PNG
    Price and License: Free to $411

    Image source: https://streamlineicons.com/

    Streamline Icons is another nice and adaptable free icon pack on the web market. The tool is organized in 53 categories with over 30000 vector icons.,

    Este é um dos poucos pacotes de ícones otimizados para Sketch, tornando mais fácil manipular as larguras e cores do traço. Características do Sketch embutido, tais como símbolos e estilos compartilhados fazem reutilizar elementos, como ícones, um processo rápido e fácil.

    a empresa tem seu próprio aplicativo web que ajuda a navegar, pesquisar e baixar ícones logo a partir do navegador.,

    características-Chave:

    • mais de 30000 vetor de ícones organizados;
    • Smart cursos para modificar o contorno de espessura;
    • Sketch, AI, EPS, PDF, PNG, SVG formatos;
    • web app para pesquisar e editar ícones;
    • cada ícone na Agilizar 3.0 tem três pesos: a luz, regular e bold.,

    Smashicons

    site: https://smashicons.com/
    Formato e Tipo: FRASCO, SVG, AI, ESBOÇO, o Mercado
    Preço e Licença: Livre para r $149

    fonte da Imagem: https://smashicons.com/

    Smashicons oferece uma completa coleção de ícones com mais de 219000+ ícones na sua biblioteca. Smashicons funciona um pouco diferente dos outros: seu preço é baseado em um plano mensal de US $5/mês., Isto significa que por $ 5 por mês você tem acesso a toda a sua coleção de ícones existentes, bem como quaisquer ícones futuros que eles lançam.

    características-Chave:

    • uma grande coleção de ícones,
    • todos os ícones são multi-plataforma compatível,
    • fácil de usar aplicativo da web para procurar e encontrar os ícones que você precisa,
    • subscrição baseado no modelo de negócio,
    • suporte multiplataforma.

    Icons8

    Web-site: https://icons8.com/
    Format and Type: SVG, PNG, PDF
    License and Pricing: Good Boy License, Free to 19.,90 por mês

    fonte da Imagem: https://icons8.com/

    O conjunto de ícones a partir de Icons8 vem com mais de 120000 ícones que abrangem várias categorias; de negócios e configurações do office para pessoas, alimentos e ícones de mídia social. Os ícones são projetados para imitar a aparência de um sistema operacional específico. Você pode baixá-los em Windows, iOS e versões Android.,

    os ícones trabalham com Sketch, Photoshop e Xcode. Você pode usar um editor web antes de baixar os ícones para o seu sistema.

    características Principais:

    • SVG, PNG e formatos HTML;
    • ícones disponíveis em diferentes estilos, tais como ícone de linha, ícone preenchido e cor completa;
    • todos os ícones podem ser transferidos via .zip file;
    • edite antes de baixar;
    • ambas as opções de assinatura gratuita e paga.,

    Icomoon

    Web-site: https://icomoon.io/
    Format and Type: SVG, PNG, PDF
    License and Pricing: Free to $139 per month

    Image source: https://icomoon.io/

    Icomoon comes as a complete tool for iconography and icon management. The product has a high-quality solution for editing and managing icons., Os ícones do Icomoon foram feitos à mão em uma grade 16X16 e estão disponíveis em formatos SVG, EPS, PSD, PDF e AI. O conjunto de ícones também é constantemente atualizado por seus criadores.

    Cada pacote de ícones possui licenciamento detalhado para que designers e desenvolvedores saibam exatamente como ícones podem ser usados. Os usuários também podem fazer suas próprias fontes de ícones personalizados.principais características:

    • ferramentas abrangentes de gestão de ícones, opções de download gratuitas e pagas, uma grande variedade de formatos de download, actualizações gratuitas e fáceis.,

    Glyphish Ícone Pack

    fonte da Imagem: http://www.glyphish.com/

    Glyphish oferece uma variedade de diferentes pacotes de icones. Cada pacote vem em uma variedade de formatos diferentes, incluindo PNG, SVG, PSD e AI. O pacote básico de ícones está disponível por $ 25 enquanto o último está disponível a um preço regular de $99. A demonstração gratuita inclui 50 ícones. Todos os ícones podem ser facilmente editados por designers.,

    características-Chave:

    • ícones para várias plataformas: iOS, Android, Web, Windows;
    • um conjunto de 50 ícones;
    • fácil de arrastar-e-soltar no Xcode;
    • ícones especialmente dimensionada para telas Retina da Apple.,

    Ionicons

    site: https://ionicons.com/
    Formato e Tipo: SVG e Webfont, Ícone de fonte
    Licença: MIT

    fonte da Imagem: https://ionicons.com/

    O Iônica equipe decidiu liberar seus ícones como um webfont chamado Ionicons. Naturalmente estão totalmente livres e disponíveis no GitHub. Você pode até mesmo adicionar esses ícones diretamente ao seu site usando a versão CDN da folha de estilo., Ele suporta totalmente fontes SVG e web.

    características-Chave:

    • completamente livre,
    • configuração fácil copiar e colar o link,
    • vem como um webfont,
    • tamanhos personalizados,
    • mais de 1.100 itens.

    Angular Material Ícones

    fonte da Imagem: https://material.io/resources/icons/?style=baseline

    Material Ícone é gratuito ícone pack do Google., Para garantir a legibilidade e clareza, estes ícones foram otimizados para ficar ótimo em todas as plataformas e exibições. Estes ícones materiais são totalmente livres e acessíveis no GitHub. Este pacote de ícones é absolutamente massivo com mais de 1.000 ícones cobrindo uma grande variedade de recursos de interface.todos os símbolos estão disponíveis em cinco temas. Você terá uma gama de tamanhos e densidades para download. O melhor formato para projetos web é um tipo de letra web de ícone fácil de usar.,

    Linearicons

    fonte da Imagem: https://linearicons.com/

    Linear Icon pack é um dos mais populares e melhores pacotes de icones para propósitos pessoais ou comerciais. O pacote de ícones lineares vem em versões gratuitas e premium. A versão gratuita deste pacote de ícones incrível vem sob licença Creative Common. Existem também pacotes diferentes que você pode escolher para suas necessidades, como o pacote Desktop.,

    Key features:

    • CloudFront CDN;
    • free version available;
    • comes with different formats: SVG, PDF, Webfont.

    Feathericons

    Web-site: https://feathericons.com/
    Format and Type: SVG, Webfont, Iconfont
    License and Pricing: Free, MIT License

    Image source: https://feathericons.com/

    Feather is one of the most popular open-source icon sets., Estes são ícones de código aberto que foram projetados em uma grade 24X24. Os ícones estão disponíveis no formato SVG. Está sob a licença do MIT, e há mais de 250 ícones em código aberto.

    os ícones são fáceis de editar, limpar e crisp — independentemente do tamanho. Eles foram projetados como um tipo de letra ícone primeiro, por isso é suposto ser incorporado como um tipo de letra web.,

    Iconfinder

    Web-site: https://www.iconfinder.com/
    Format: SVG, PNG, ICO, Marketplace
    License and Pricing: From $9 to $49 per month

    Image source: https://www.iconfinder.com/

    Iconfinder is one of the most popular icon resources on the net. It offers over 4 million icons, providing users with a variety of search options including icon format, price, size, background, etc., Existem vários planos de pagamento mensais – de $ 9 a $ 49. Você também pode escolher o sistema “pay as you go”.

    Icon files are available in SVG, PNG, ICO, ICNS, and Adobe Illustrator formats, and dimensions range between 16×16 to 512×512. Você também pode trabalhar com alguns dos melhores designers do site se você não pode encontrar algo que você gosta ou simplesmente quer ícones personalizados projetados especialmente para você e sua marca.,

    características Principais:

    • tanto opções de Utilização gratuitas como pagas,
    • Recursos de pesquisa flexíveis,
    • ícones disponíveis numa variedade de formatos,

    • um monte de categorias e estilos,
    • editor de ícones.

    O Substantivo Projeto

    fonte da Imagem: https://thenounproject.com/

    O Substantivo Projeto oferece uma das maiores bibliotecas de ícones disponíveis na web., A maioria dos ícones deste site estão disponíveis em formatos SVG e PNG, bem como em estilos preto e branco.

    a biblioteca do site é composta de arquivos icon projetados por uma variedade de designers independentes. É um lugar onde criadores e profissionais criativos podem colaborar para vender seus projetos e encontrar uma biblioteca aparentemente interminável de ícones premium.

    Procurar nesta enorme e abrangente biblioteca de ícones é muito fácil. As principais características adicionais desta biblioteca de ícones incluem opções de download gratuitas e premium, muitos grandes conjuntos de ícones, uma aplicação para Mac e muito mais., Esta biblioteca de ícones é atualizada regularmente, e novos ícones e conjuntos estão sendo postados todos os dias.

    características-Chave:

    • mais de 150.000 ícones;
    • SVG, PNG;
    • a pesquisa e a descoberta de ferramentas;
    • Licença Creative commons, com opções premium;
    • gratuitas e pagas opções de download;
    • novos ícones carregado em um quase diariamente.

    Fontawesome Icons

    Web-site: https://fontawesome.com/icons
    Format and Type: SVG, PNG, Icon font, Marketplace
    License and Pricing: SIL OFL 1.,1

    fonte da Imagem: https://fontawesome.com/icons

    Fonte Incrível é o mais usado e mais popular ícone de fonte definida ao redor. É também o conjunto de ícones padrão para a equipe no bootstrap. Ele também está disponível como ícones SVG entre outros formatos.A licença está aberta e gratuita para qualquer coisa, comercial ou pessoal.

    cada ícone é totalmente escalável e pode ser mantido diretamente em CSS., Você pode mudar cores, sombras, gradientes de fundo e praticamente qualquer outra coisa usando CSS3 puro. Outra razão para usar esta Biblioteca é que ela está totalmente otimizada e não tem problemas de compatibilidade porque ela não requer JavaScript em tudo.

    características-Chave:

    • tipo de Letra Vector,
    • cada ícone vem com uma Classe CSS & Unicode,
    • livre,
    • construído com acessibilidade em mente,
    • recursos de atualização fácil, através de sites,
    • oferece um ambiente de trabalho cheat sheet para toda a biblioteca de ícone.,

    Lineicons

    site: https://lineicons.com/
    Formato e Tipo: SVG, de fontes Web, Ícone de fonte
    Licença e Preços de: Livre

    fonte da Imagem: https://lineicons.com/

    LineIcons também fornecer gratuitamente CDN com documentação clara o que torna mais fácil para começar.

    Esta embalagem de ícones é completamente livre e vem com ícones de linha 450+., Ele cobre cada ícone essencial que você precisa para o projeto de diferentes categorias. LineIcons também fornece CDN livre e documentação clara para começar facilmente. Ele vem com 2 pacotes escaláveis diferentes-WebFonts e arquivos SVG que você pode usar dependendo de suas necessidades de projeto.

    características Principais:

    • 450+ ícones livres,
    • ficheiros SVG,
    • Fonte Web Ready,
    • CDN livre.,

    Pensamentos finais

    escolher o recurso da biblioteca de ícones para o seu projecto não deve basear-se no que é considerado mais popular, mas sim no que melhor se adequa às necessidades do seu projecto. Ao escolher ícones, preste atenção ao quão fácil é iniciar um projeto, que formatos estão presentes na biblioteca e o preço.

    também, um fator importante ao escolher um pacote de ícones será corresponder ao estilo de sua aplicação ou site.esperamos que este artigo o ajude a escolher a solução mais adequada para as suas necessidades.