Clique, salve edite e estilize seus ícones
com as Coleções do Flaticon
As coleções são úteis para todos que quiserem manter seus ícones organizados, visualizar e manter a consistência em seu projeto. Elas são simples de usar e podem beneficiar tanto iniciantes quanto profissionais.
Ver mais
Organizar
Guarde os ícones que você precisa de diferentes pacotes em um único lugar. Separe suas coleções por projeto e adicione, remova, edite e renomeie ícones.
Salvar
Clique em "backup de ícones" e baixe uma cópia de sua coleção. Compartilhe com seus colegas de equipe ou use mais tarde.
Editar
Para pintar todos os ícones monocromáticos com diferentes cores, use o recurso "Pintar coleção" e escolha sua cor preferida.
Recursos Exclusivos
Além dos formatos PNG, SVG, EPS e PSD , você pode baixar sua coleção como "Fonte de ícones" ou "Sprite SVG" . Esses recursos são usados por web designers e permitem que você baixe um arquivo que contenha todos os ícones em forma de código. É uma maneira simples de trabalhar com design responsivo e fácil de manipular com CSS3.
Fonte de ícones
Ela é suportada por todos os navegadores e fácil de usar — você pode alterar a cor ou adicionar uma sombra à forma da fonte de ícones. Mas esse recurso só funciona com ícones monocromáticos.
Para usar ícones coloridos na sua web, clique em Sprite SVG.
<head>
…
<link rel="stylesheet" type="text/css" href="your_website_domain/css_root/flaticon.css">
…
</head>
.flaticon-airplane
SVG Sprite
Bem similar ao Icon font, o SVG Sprite permite que você baixe fontes na forma de um código e use em sua rede. Também é totalmente personalizável com CSS2, mas diferentemente do "Icon font", funciona com ícones coloridos.
<div hidden>
<svg style="display: none;" xmlns="http://www.w3.org/2000/svg"> <symbol id="blueberries" viewbox="0 0 53.308 53.308">
<title>
blueberries
</title>
<path d="M39.685,2.953c-7.524,0-13.623,6.099-13.623,13.623c0,2.243, 0.552,4.353,1.512,6.219 c1.496-0.565,3.11-0.888,4.804-0.888c5.281,0,9.851,3.011,12.111,7.404c5.15-1.944,8.819-6.905,8.819-12.735 C53.308,9.052,47.208,2.953,39.685,2.953z" style="fill:#003879;">
</path>
…
</svg>
</div>
<svg class="icon">
<use xlink:href="#blueberries"/>
</svg>
#blueberries
Experimente agora
Está a fim de iniciar seu novo projeto e usar coleções imediatamente? Confira nosso guia passo a passo.
Explorar o Flaticon