Copy link to clipboard
Copied
Hi,
Im having issues with XD when I export a component from XD as a svg with a fill color of #000000 (black). The exported svg file does not have all the elements with a fill color of black as per how it is set up in the document. Visually the file looks fine but when it is being implement via code it appears different. When I change the fill color to #000001 (or any other color except #000000) it works fine meaning the exported svg has every element with a fill color assigned. Is this a bug or am I doing something wrong with export settings? The svg export setting I used are "Presentation Attributes" for Styling, "Embed" for Save images and optimised.
Copy link to clipboard
Copied
Are you saying the exported SVG does not look like it does in XD? I just exported an SVG with black elements. While it does not have black listed in the code, the elements appear as black in a web browser (or when imported into a design app).
Copy link to clipboard
Copied
Hi Dan,
Thanks Dan for looking into the issue. I faced the same issue today and feel the color black not being listed in the code is having some bearing in this. Have attached a file that shows the expected and actual result. When I changed the color value from #000000 to #000001 it works. So not sure what's happening.
Copy link to clipboard
Copied
We're having this same issue - it seems when exporting SVGs any blacks are converted into no fill, assuming the fall-back colour is black anyway, which it usually is. We however have a style rule in our design system which applies currentColor to anything without a fill, which means that anything that was intended to be black may end up not being black when rendered. Illustrator distinguishes between [Registration] (which applies no fill) and a colour fill (which can be black) and this is previously how we had tested this feature.
I have just tested this myself in Illustrator and it appears to be happening there also when exporting SVGs. Both black filled and [Registration] filled objects get no fill attribute, so it looks likely this affects multiple Adobe products.