add an option for color

[vlaminck]

What

This allows the color to be configured by passing a hex value via --color

• Hex values must be either 6 or 8 characters long (not including the # character)
• The # character is optional
• The hex format is RGB or RGBA

Valid Examples

sfsymbols --output symbols --format png --color "#00dd1133"
sfsymbols --output symbols --format png --color 00dd1133
sfsymbols --output symbols --format png --color "#aa1122"
sfsymbols --output symbols --format png --color AA1122

Limitations

Exporters that use bezier paths aren't supported because a color wasn't specified in those files. This implementation simply replaces the hard-coded black values with a configurable option. I can spend time making sure the other exporters make use of the color as well, but since they export code, I feel like it would be easier to update the exported code afterward.

Other Considerations

This could be updated to use named colors as well as hex values. In which case, I'd want to change the options to something like --hexColor and --namedColor.

[davedelong]

How does this work with the new multicolor symbols in the most recent beta?

[glouel]

How does this work with the new multicolor symbols in the most recent beta?

@davedelong not the original submitter but I would consider this as an independent issue. Personally I'd very much recommend adding this option. I forked the project just to change the color to white, in order to export to pdf with white glyph color, so I could use them for the weather icons in Aerial (https://github.com/JohnCoates/Aerial), so I would welcome that change being merged.

Going back to multicolor symbols, I think this is orthogonal to the issue of coloring the glyphs, I don't know if you tried SF Symbols 2, but the colored glyphs don't have a special name, you have to press a color wheel button at the top of the UI to get the colored version of the glyphs.

Color off, light mode UI :

Color on, light mode UI :

Color on, dark mode UI :

You'll notice a few things :

• Glyphs names are the same, so however they implemented it, it looks optional in some way
• When colored, the colors are "consistent", the white arrow stays white in light/dark mode
• But the colors do get tweaked a bit, the yellow is not the same in light/dark mode

This seems consistent with Apple's description of the multicolor symbols :

Multicolor Symbols
Over 150 preconfigured, multicolor symbols that adapt dynamically with Apple platform system colors.

So yeah, they adapt slightly the colors it seems, but they stay in the same ballpark.

I have quite frankly zero idea of how they are implementing this with fonts, and since the glyph name is the same, I don't know if they are using an extension to the ttf format or something completely separate to color the glyphs. An extension to ttf is quite possible, because as of right now, your font loading code doesn't handle correctly the SF Symbols 2 font so it's really a separate issue (see here, I tried to debug this but I don't know much about fonts : https://github.com/davedelong/sfsymbols/issues/23#issuecomment-657256501). Or maybe the new colors icons are only available through some API and not as fonts, quite frankly I don't know.

If I had to guess, I'd say the color thing is only available through the API (or some very weird, unsupported everywhere/maybe proprietary extension). If I paste for example a color icon from SF Symbols 2 to Sublime Text or Pages, in both cases I get the "classic" uncolored glyph.