Help Understanding Margins in Custom SF Symbols

Hello!

I've been struggling for a while to understand exactly how margins work for custom SF symbols.

For example, I'll have two identical svg templates containing near-identical icons (each with a circle outline and a shape in the middle), see attached images. The icons are positioned in the exact same manner in the template, so that the only difference is the symbol inside the circle.

When these symbols are exported from SF Symbols and put into Xcode, I noticed that one of the symbols has a slight margin to the right and to the bottom of the symbol, causing it to fall out of alignment with surrounding symbols.

I've been trying to eliminate this margin in any way I can think of, but to no avail. Anyone able to offer assistance on how to remove it and/or an explanation as to why it's there?

Help Understanding Margins in Custom SF Symbols
 
 
Q