Font Awesome fonts to Sketch.app by category
Andreas Koutsoukos
Posted on May 16, 2022
🙏🏻 Get the license and download files
First thing is to get the Font Awesome pro license
🏆 The goal
If you are like me you liked to have one source of true everything right? Imagine situation that you have components library Sketch file in Abstract version control. The components are using local icons SVG source in the same file. Thats is not a problem when you have 10-20 icons. But issue comes when you liked to have all the source from pro versions Font Awesome. You need to add all SVG files by great plugin called Sketch Icons without any control. It looks like huge dropdown list in the Sketch Symbols selector. So what if you could make it look like organized?
🔨 This is how you do it
- Unzip the fontawesome-pro-x.x.x-web.zip
- Add new folder named by script (or whatever)
- Go to metadata folder and copy categories.yml syntax to clipboard and paste .yml content YAML to JSON converter online
- Create new file inside script by categories.json and paste JSON syntax from YAML to JSON converter to the file
- Create new folder and named by svgs
Copy .svg icons from svgs fontawesome-pro-x.x.x-web root file to the new svgs folder under script
Create read-json.py file and paste this code
# Python program to read
# json file
import json
import os
import shutil
# Opening JSON file
f = open('./categories.json')
# Getting svgs files and folder
svgsFolder = 'svgs'
svgsFilesDirectory = os.path.join(os.path.dirname(__file__), svgsFolder)
# returns JSON object as
# a dictionary
data = json.load(f)
# Iterating through the json
# list
for category_list in data['categories']:
for key, value in category_list.items():
iconDircectory= os.path.join(svgsFilesDirectory, key)
os.mkdir(iconDircectory)
print("Directory '% s' created" % iconDircectory)
for icon in value['icons']:
file = str(icon) + '.svg'
file_name = os.path.join(svgsFilesDirectory, file)
destination = str(iconDircectory) + '/'
print(destination)
shutil.copy(file_name, destination)
print("Files Moved")
# Closing file
f.close()
- Run the .py code and check the How We Do It :)
- Now use the Sketch Icons plugin to import the folder by one by one.
Hope you liked this! Enjoy!
Posted on May 16, 2022
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.