Firstly, thanks for GenerateBlocks Pro and GeneratePress Pro - both super helpful for me!
When adding SVG icons (provided by a client), I found that they looked OK in the Asset Library, but they became stretched when I used them in GB headlines. My SVGs are not all perfectly square. In the code they had a viewport set but not separate width and height attributes.
I fixed it by setting the viewport width and height (in the SVG code) to be the equal to largest dimension. Then I needed to set either the viewport x or y attribute to be a negative value equal to half the height-width difference.
(I also made other improvements to the opening SVG tag)
For example, this:
I didn’t see a note in the documentation about ensuring SVG icons have same height and width, but I think GB’s css output assumes this.