Our devs are struggling with this problem too. We need an "Inline Style" option for Shared Link with Design Specs so that developers can download and use SVG easily. As a designer, I'm frustrated to manually export all SVG files via Ai and send them to developers instead of giving them a good option via shared link.

Please don't mark this as fixed for export popup only. The issue is still there in dev specs of shared links as well.

Has this been fixed yet? I'm having major issues with my devs using the exported SVG's

Exported SVG assets from XD need to be imported into Illustrator and re-exported just to be able to get the minification and inline styling. This is a problem that can be fixed easily but not sure why the option doesn't exist already.

Hi,

My engineering team is also reporting this as an issue. Definitely need that fixed.

My devs have just raised this issue as well! What is the point of having a tool that allows for dev handoff when the devs can't use or have to seriously alter what you handoff to them?!

My devs are having to strip/rewrite the SVG code or aren't sure where the actual SVG starts in some cases so they wind up creating them themselves! Recipe for disaster! (See screenshot.)

Sounds like Sketch is the way to go from reading other comments!

Unbelievable, only XD doesn't support inline SVGs. I have no other option than to go back to Sketch.
This issue was reported in 2017. Three years later nothing happened. Unbelievable. This is maybe the most important feature or MUST HAVE thing in the app. What's worth designing anything, when I cannot handover that design to the developer. Once again, UNBELIEVABLE!

I've come across the same issue packaging for development specs, a developer just asked this question and had the same issue where they need to manually edit the svg class. Can we get the choice in how SVGs are exported with dev specs - so we can choose inline, or fix the auto class naming convention so it's generated randomly for each different icon/svg?

At least the choice between style and attribute would be a great solution for this. Now I have to export all assets and then open them in Illustrator to save with attribute styling to fix the class mixup. This is quite struggle for the hand-of to developers!

This is important. It is an obstacle when I have to deliver the assets to DEV. Please, make it inline by default, or provide the options to choose from. Thx

PLEASE PLEASE PLEASE FIX THIS! Might have to go back to using Sketch!

This is really getting on the way of our design to dev handoff... Very frustrating!

Please fix this, I always have to open the XD exported svg in Illustrator and export again to have inline styles.

Export SVG with inle style (not internal css) for better interoperability ( ex: Application build in Qt )

I don't think in-line styles would be the best solution for this. One of the main benefits of SVG is that you can easily style it in your CSS. So I can color my logo.svg using css vars and have that logo instantly update if I decide to change my color pallet (and by extension change the values of my CSS variables). Of course you can still do this with setting rules as !important, but that's usually undesireable.

I think a cleaner fix is to keep the classnames, but simply prefix them with the filename (or anything else). So you would end up with stuff like logo1-cls-1 as the class name and can avoid the issue with multiple SVGs conflicting.

As a workaround for the current situation, I just pull everything out of the style tag and drop it into my css, then add a parent class to all the rules.

+1 please why hasn't this been fixed yet?

Same issue here. Have to go through and rename the classes if there are multiple SVGs on one page. Can get very tedious when dealing with intricate SVGs.

Same problem here.

+1

In Illustrator when you output the SVG you can select if you want the styles inline, or as presentation attributes. I think this would be a great addition to XD to select what way you want styling to be applied to SVG elements.