I have recently been trying to switch from Sketch to Figma, and a lot of things have been really nice. However, Figma’s SVG handling is not one of those nice things.

So far the biggest issue has been Figma’s automatic outlining of some stroked paths. Not only is Figma outlining the strokes, but splitting them up into multiple small shapes, making for a much larger than necessary file size.

Example:

The stroke here was automatically converted to shapes when exported from Figma.

However redrawing that exact same shape in Figma and re-exporting resulted in it being properly exported as a path with a stroke.

This behavior is simply too inconsistent to use in a production environment. Often I need to be able to access and adjust a path in code, such as adjusting stroke width or even animating a path. This behavior from Figma makes those SVGs unusable.

The other big pain point is the automatic “flattening” of the files, by removing any groups from the SVG that were present in the design file. Again, often I want to be able to make changes in code, and by removing groups Figma is taking away my ability to make transformations to groups of paths.

I would be fine with having options to flatten groups or outline strokes on export, but it is borderline broken to do so automatically.