Icon builder from font awesome

I’ve just got a streamdeck for christmas and am loving it! Though I find it cumbersome to search for icons so I wrote a quick&dirty program to pull icons from Font Awesome and render them in the correct size as 72x72 png files:

What I’m asking is: Would this be a desirable feature to add to streamdeck-ui? I’d imagine a small text field where one would enter, for example, volume-up and the corrrect image is displayed.

To quote https://github.com/FortAwesome/Font-Awesome

In the Font Awesome Free download, the CC BY 4.0 license applies to all icons packaged as .svg and .js files types.

So the icons can be shared and remixed as long as attribution is given.

I see two ways of implementing this:

• streamdeck-ui could just wget https://raw.githubusercontent.com/FortAwesome/Font-Awesome/master/metadata/icons.yml, search for the desired icon and download only this from the correct location in the official github-repo
• streamdeck-ui could, by default, ship with all icons (all svgs are about 1.6 megabyte, but they could also be pre-rendered as .png instead)

I’d volunteer to implement this if it seems like a useful feature.

[dodgyrabbit]

Probably doesn’t make sense to bundle fonts with this program. However, maybe an alternative is to make it possible to pick the desired font and size for the “Text” field. “Nerd fonts” is also a really good option if you’re looking for fonts with ligatures and glyphs.

[Gnarflord]

Ok, but I mean really quick&dirty! This is a small python program, it needs a pip-package (installed via pip install fontawesome) and the font awesome as ttf (which I’ve installed under Arch via pacman -S ttf-font-awesome).

Problem is: Generic icons (volume control etc) and brand icons (spotify) are in seperate font-files. Because I’m lazy I simply run the script twice, once with fa-solid-900.ttf and then again with fa-brands-400.ttf

Good luck!

from PIL import ImageFont, Image, ImageDraw
import fontawesome as fa
import os

# List of icons to draw
# Elements are either "icon-name" or ["icon-name", "color-code"]
icons = [
        "volume-down",
        "volume-up",
        "fast-forward",
        "forward",
        "fast-backward",
        "microphone-slash",
        "volume-mute",
        "music",
        "undo",
        "play",
        ["spotify", "#1db954"], # Draw Spotify in nice green!
        ]

# Load a OpenFont format font from a local directory as an ImageFont object
# In this case, a TrueType font using the truetype method.

# Uncomment the needed TTF: fa-solid for generic icons and fa-brands for brand icons!
font = ImageFont.truetype(font='/usr/share/fonts/TTF/fa-solid-900.ttf', size=45)
#font = ImageFont.truetype(font='/usr/share/fonts/TTF/fa-brands-400.ttf', size=45)

for element in icons:
    if isinstance(element, list):
        color = element[1]
        icon = element[0]
    else:
        icon = element
        color = '#ffffff'

    print(icon, end=", ")
    print(fa.icons[icon])

    # Create a new image onto which the text will be added
    image = Image.new(mode='RGB', size=(72, 72), color='#000000')

    # Create an ImageDraw object onto which the font text will be placed
    draw = ImageDraw.Draw(im=image)

    # Draw the text onto our image
    draw.text(xy=(72/2, 72/2), text=fa.icons[icon], font=font, fill=color, anchor='mm')

    # Save icons in temp-folder
    path = "/tmp/" + icon + ".png"
    print(path)
    image.save(path)