Musical notes images


For my app Music-notes, I was searching for images of musical notes so I can use them in my flash card feature. Unfortunately, I couldn’t found one, hence I spent time to generate  programatically.

TL;DR

Feel free to use the assets the way you want (MIT)

* Download SVG

Note: PNG version - are 3x scaled version of SVG.

My workflow to generate SVG

I knew about VexFlow, as there is always I’ve some idea which requires this library. As usual I overshot my estimate only to learn, it doesn’t have an option to generate notes to a given height & width. 

So, I forked their sample to generate each notes. And I resized them using svg editor, I set the height to `130` as it seems vertically center to me.

Also used Gapplin to scale and export them to PNG.

Update - 2018-03-20:

Post Comment