Intro

I've been using a Stream Deck for quite a while now. There are some amazing plugins out there that make some of the daily tasks a bit quicker.
I use it a lot for launching programs, audio (toggling microphone, chaning output between speakers and headset, volume mixer), CAD and as a generic macropad to open websites, explorer scratchpads and such.

But I've always had issues finding icons. Some people are fine with mixing differently styled icon packs, but I'm not. So every time I need a new icon it's a bit of a hassle to find a new icon that roughly matches the existing ones.
I have no graphical skills whatsoever, so designing my own iconset really wasn't a solution.

I usually use Fontawesome for icons in web development, they have a pretty decent selection of uniform icons, so why not do the same for the Stream Deck.

My idea: fontawesome + TailwindCSS color palette = tons of icons.

Code

Bash

I first wrote a quick bash script to do this, ImageMagick has a CLI tool to overlay images.
It worked well enough, but there was no way to resize icons to 50x50 max while maintaining the aspect ratio. It is possible to let ImageMagick to auto-resize the missing dimension, but that meant some aspect ratios looked bad because the icons would be too wide/tall.

Additionally, I had to create the 72x72 solid background images manually. A bit tedious to do that 22 times, just for one tone, I would have to repeat all that if I wanted to test the another tone.

Node

After the bash MVP I moved to a quick NodeJS script.

Wit Node I could just import the Tailwind color palette, no endless copy&pasting to test other tints.
Ontop of that, Node has sharp, a great tool to create images.

The code itself pretty simple, just some loops iterating over .svgs and different color combinations.
Pretty sure there is room for improvement, especially speed wise, but it does it's job. Might run some 15mins to generate 400.000 icons, but this script isn't going to run every day anyways.

Here is a link to the repo, generating icons using different color tones or icon sizes should be pretty straight forward.

streamdeck-icons repo
streamdeck-icons repo

Preview

36px

50px

All rose color variations (and the black and white versions)

36px vs 50px

Download

For anyone interested, the generated icons are available here

Color 36px 50px
Slate File File
Gray File File
Zinc File File
Neutral File File
Stone File File
Red File File
Orange File File
Amber File File
Yellow File File
Lime File File
Green File File
Emerald File File
Teal File File
Cyan File File
Sky File File
Blue File File
Indigo File File
Violet File File
Purple File File
Fuchsia File File
Pink File File
Rose File File
Black & White File File
All File File

All credit for the icons goes to Fontawesome, I merely colored them by stealing some hex-codes