SVG embedding tips

Some SVG embedding tips I thought I would share:
1. If you want to add an SVG icon to a heading element, and you have the code, (generated from XD, illustrator or anywhere else), pass it through the optimizer before pasting in the generateblocks input box. I had some issues with SVG icons looking strange and the optimizer helped.
More info here: https://community.generateblocks.com/t/strange-svg-icon-behaviour/403
SVG Optimizer: https://jakearchibald.github.io/svgomg/
2. If you want to add SVG as a pseudo css element, pass it through this optimizer: https://yoksel.github.io/url-encoder/.
You can use either content or background image.
For example (using the 'content' attribute):

.your-class-name:after {
	content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14' fill='%23043d54' stroke='%23043d54' height='10' width='10'%3E%3Cg transform='matrix(0.5833333333333334,0,0,0.5833333333333334,0,0)'%3E%3Cpath d='m5.651 23.5 12.576-11.126a.5.5 0 0 0 0-.748L5.651.5' fill='none' stroke-linecap='round' stroke-linejoin='round'%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
height: 20px; width: 20px; position: absolute; margin-left:5px; margin-top:1px; right:-23px;
}

Hope it helps.
Dan