Extrator de fontes de ícones
5 / 5Decodifique uma fonte de ícones WOFF2, WOFF, TTF ou OTF em ícones SVG individuais e nomeados. Visualize cada glifo, recupere os nomes a partir da fonte ou do seu CSS e baixe arquivos SVG separados ou um sprite SVG.
Envie a fonte de ícones
WOFF2, WOFF, TTF ou OTF de até 10 MB. Anexe o CSS ou cole a URL da fonte para obter nomes melhores.
WOFF2, WOFF, TTF ou OTF — até 10 MB
Como funciona o extrator de fontes de ícones
Transforme uma fonte de ícones WOFF2, WOFF, TTF ou OTF em ícones SVG limpos e nomeados — arquivos separados ou um sprite, prontos para produção.
Qualquer fonte de ícones
Envie WOFF2, WOFF, TTF ou OTF — ou cole a URL da fonte. O extrator decodifica o contorno de cada glifo diretamente da fonte, sem perda de qualidade e sem vetorização.
Nomes reais, não pontos de código
Os nomes são recuperados da fonte (nomes de glifos, ligaduras) e, se você anexar o CSS, dos nomes das suas classes, como .icon-home — assim você recebe home.svg, e não icon-e900.svg.
SVGs separados ou um sprite
Baixe cada ícone como um SVG otimizado individual (ZIP) ou um único sprite SVG com um symbol por ícone. Os dois usam currentColor, então você pode mudar a cor no CSS.
Migre conjuntos de ícones antigos
Tem um projeto antigo com fonte de ícones, mas sem os SVGs originais? Recupere o conjunto inteiro como arquivos SVG limpos e nomeados, prontos para um sprite, componentes React/Vue ou o Figma.
Perguntas frequentes
WOFF2, WOFF, TTF e OTF. A fonte é analisada no servidor com o fontTools, então até arquivos WOFF2 compactados funcionam. Você também pode colar a URL direta de uma fonte.
Em ordem de prioridade: a sua classe CSS (se você anexar o CSS), a ligadura da fonte, o nome do glifo OpenType, o nome Unicode e, por último, um nome gerado icon-XXXX.
Fontes de texto não são conjuntos de ícones. Por padrão, só são extraídos os glifos da Private Use Area (onde ficam as fontes de ícones), então uma fonte comum rende pouco ou nada.
Sim — cada ícone é um caminho vetorial de verdade, com viewBox e fill="currentColor". Abra-os no Editor de SVG, coloque-os em um sprite ou importe-os no Figma como vetores.