The padding around icons makes it difficult to align them properly with other elements on the page.
Here is the Circle Outlined Thin icon:
You can see from the selection box that the icon is larger than it visually looks. When trying to align things to the visual edges of icons, this makes Mockups slower to use, not faster.
It could be argued that someone using Mockups should not be aiming for pixel perfection.
However, if making a change such as this helps the user get closer to pixel perfection and using Mockups is just as fast, I’d say it’s a win-win!
Here is another example, the Square Outlined icon:
The padding at the bottom of the icon is greater than the padding at the top of the icon! This means anyone using the quick guides to position elements relative to this icon will end up with the elements below further away than the elements above.
In this case, it’s not an issue of visual perfection, but of consistency, which is a founding principle of design.
I’m curious: What is the reason that icons have this padding around them in the first place?