IP Girl
  1. IP Girl
  3. Extraire SVG de Font Awesome
Intereting Posts
Charger une image à partir du dossier assets Obtenir un FILE * depuis un std :: fstream Comment faire en sorte que Maven mène la guerre: explosée mais pas guerre: guerre Échec lorsque j’ai essayé de mettre à jour mon application Détecter la taille de la police Windows (100%, 125%, 150%) Que sont le propriétaire du fichier et le premier répondeur dans le SDK iPhone – xCode? Comment le kernel Linux sait-il où chercher le micrologiciel du pilote? C # exécuter un thread toutes les X minutes, mais seulement si ce thread ne fonctionne pas déjà référence indéfinie à sqrt (ou autres fonctions mathématiques) Quelle est la différence entre une classe abstraite et une interface? Obtenir uniquement l’en-tête de réponse de HTTP POST en utilisant curl Comment puis-je marquer une contrainte de clé étrangère à l’aide des annotations d’hibernation? Importer / Indexer un fichier JSON dans Elasticsearch Piège variable extérieur Instruction Visual Studio C # se réduisant

Extraire SVG de Font Awesome

Je veux obtenir les données du chemin SVG à partir des glyphes de Font Awesome afin que je puisse les utiliser directement en tant que SVG dans mon HTML. Je pensais que ce serait aussi simple que de copier-coller les données de chemin de fontawesome-webfont.svg , mais quand je les utilise dans mon code HTML, les symboles sont tous rendus à l’envers. Quelqu’un sait pourquoi?

(Voir violon )

Police SVG génial:

… Porté en HTML SVG (et réduit):

Tout selon la spécification SVG …

Contrairement aux graphiques standard en SVG, avec l’axe des ordonnées du système de coordonnées initial orienté vers le bas, la grid de conception des fonts SVG et le système de coordonnées initial des glyphes ont l’axe des ordonnées vers le haut. de nombreux formats de fonts populaires.

Selon ce commentaire , Changer le wrapper en semble faire l’affaire, où 1792 est l’unité-per-em et 1536 est l’ascension de l’élément font-face

Il suffit de récupérer les icons svg prêtes de ce repository github
Ils sont déjà retournés et centrés au besoin

entrer la description de l'image ici

Appuyez sur n’importe quel fichier, puis sur “Raw” entrer la description de l'image ici

L’application IcoMoon rend cette mort simple.

Utilisez le script fontforge. Il y a un script que j’ai trouvé en ligne ici : 

 fontforge -lang=ff -c 'Open($1); SelectWorthOutputting(); foreach Export("svg"); endloop;' font.ttf

Voir: http://fontforge.sourceforge.net/scripting.html

Vous pouvez les télécharger depuis flaticon.com ici:

http://www.flaticon.com/packs/font-awesome

Il y a aussi un outil node.js qui automatisera ceci pour vous, et créera un verify.html avant et après. https://github.com/eugene1g/font-blast

Je l’ai utilisé sur d’autres fonts, seulement 1 mauvaise conversion d’icône jusqu’ici, mais rest dans la police SVG était bien.

Vous pouvez simplement télécharger la dernière version de fa ici: https://fontawesome.com/

Et puis allez dans le dossier advanced-options/raw-svg . Vous y trouverez trois brands dossiers, regular et solid contenant toutes les dernières icons disponibles.