Hello, community
I am creating an icon set, and I want to deliver it to the development team in SVG format.
The problem I faced is that some SVG codes export with the stroke that I want, but some export as a filled one (it seems that Figma first use outline stroke then export it)
You can see two different icon svg file
Yeah, this is super annoying. It’s real finnicky though. If you are able to put the individual parts of your icon on their own layers it might export like you want. I needed mine to all be flattened and was able to get it to work by flattening one part and then the whole icon. It’s super weird.
Have you made a union of any of these stroked elements?
Figma will convert any union elements, even if they are strokes, to fills.
Workaround might be to simply group these stroked elements together in one group, and try to export then.
I ran into a similar issue, when trying to export a single line. It turned out to be caused by the fact that one of the line-ending points was set to “round”, and the other one to “none”.
In order to export this very long “U”-shaped stroke, Figma had to convert it into a shape (without a stroke).
The fix was to separate the line in two: one with “line-ending: round” on both sides slightly overlapping another one with “line-ending: none” on both sides.
Enter your E-mail address. We'll send you an e-mail with instructions to reset your password.