Can't change icon color inside Elementor anymore. Unnecessary fill:#000.

[Kristofer34386738dbpa]

Before, if I was making black (#000000 or #000) icons in Adobe Illustrator then I was always able to instantly change its color inside Elementor Website Builder. Now I always have to open my svg file with notepad and remove "fill:#000" from each icon Im trying to make. This is always inside that kind of area: .d{fill:#000;stroke-width:0px;}. What may have caused it? If I check my old files then I can see that before my files didn't have fill:#000 but now they do. (Yes, my old files (icons) were also simple and their color was always #000000)

[Kristofer34386738dbpa]

Here is exactly the same file before and after:
Before (I can change its color inside Elementor): 

<svg xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 19.96 19.96" width="19.96"  height="19.96" ><g id="Layer_2" data-name="Layer 2"><g id="dark"><path d="M19.21,14a2.58,2.58,0,0,1,0,3.64l-.76.88C11.62,25-5,8.4,1.45,1.56l1-.84A2.57,2.57,0,0,1,6,.76l1.57,2a2.58,2.58,0,0,1,0,3.56l-1,1.22a10.63,10.63,0,0,0,5.78,5.78l1.22-1a2.59,2.59,0,0,1,3.57,0Zm-1.15,1.21L16,13.6a.91.91,0,0,0-1.29,0L13.05,15a.86.86,0,0,1-.82.13A12.53,12.53,0,0,1,4.88,7.75.85.85,0,0,1,5,6.92L6.36,5.21a.91.91,0,0,0,0-1.29l-1.55-2a.93.93,0,0,0-1.26,0l-1,.84C-2.11,8.42,12.28,22,17.23,17.33l.76-.88a.92.92,0,0,0,.07-1.29Z"/></g></g></svg>

After/Now (I can't change its color inside Elementor):

<?xml version="1.0" encoding="UTF-8"?><svg id="b" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 19.971 19.964"><defs><style>.f{fill:#000;stroke-width:0px;}</style></defs><g id="c"><g id="d"><g id="e"><path class="f" d="M19.219,13.972c1.002,1.007,1.002,2.633,0,3.64l-.76.88C11.629,24.972-4.991,8.372,1.459,1.532l1-.84c1.004-.937,2.567-.92,3.55.04l1.57,2c.95.997.95,2.563,0,3.56l-1,1.22c1.079,2.62,3.16,4.701,5.78,5.78l1.22-1c1-.951,2.57-.951,3.57,0l2.07,1.68ZM18.069,15.182l-2.06-1.61c-.355-.356-.931-.358-1.287-.003-.001.001-.002.002-.003.003l-1.66,1.4c-.233.181-.542.23-.82.13-3.405-1.277-6.087-3.97-7.35-7.38-.109-.279-.063-.594.12-.83l1.36-1.71c.356-.355.358-.931.003-1.287-.001-.001-.002-.002-.003-.003l-1.55-2c-.356-.328-.904-.328-1.26,0l-1,.84c-4.66,5.66,9.73,19.24,14.68,14.57l.76-.88c.372-.339.403-.913.07-1.29v.05Z"/></g></g></g></svg>

[Doug A Roberts]

Can you share your SVG export settings as well as the appearance panel for your object?

[Kristofer34386738dbpa]

I have tried changing every SVG export setting there is.
Export settings are here:

Appearance Panel is here:

[Doug A Roberts]

Can you share the definition of the black from the colour panel? This is what I get if I export a circle filled with RGB black using those settings:

<?xml version="1.0" encoding="UTF-8"?>
<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 562.09655 562.09655">
  <defs>
    <style>
      .cls-1 {
        stroke-width: 0px;
      }
    </style>
  </defs>
  <circle class="cls-1" cx="281.04828" cy="281.04828" r="281.04828"/>
</svg>

[defaultdbw54z56jwz0]

What Version of Illustrator are you using? I feel like this started happening with Illustrator2024, I never had that issue before but it's exactly as OP said to. If I open the SVG in a Code Editor like VSC and remove said line "fill:#000;" it works fine in Elementor. Might actually Adobe having messed up the SVG export with the update

[Doug A Roberts]

Correct, I get a style definition for a black fill in 28.4.1, but none in 27.9:

<?xml version="1.0" encoding="UTF-8"?>
    <svg id="a" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 267.656 267.656">
        <defs>
            <style>.b{fill:#000;stroke-width:0px;}</style>
        </defs>
    <circle class="b" cx="133.828" cy="133.828" r="133.828"/>
</svg>

I know that the Save As SVG code was changed in 28.4, but there may have been other changes in Export As that I'm unaware of. I will try and find out more.

[Doug A Roberts]

I've been informed this is a bug and will be fixed. I don't know a timeframe.

[cbesett]

That's unfortunate.  I have the same issue.

[panther-disco]

Definitely appears to be an Adobe issue. I removed the fill:#000 from an SVG file and was able to successfully edit the icon color in Elementor.

So I downloaded earlier files from that same site I am working on (uploaded+created in December 2023) and the fill info in that file was fill:none. File created the same way, set to #000 in Illustrator. 

Thanks for helping me figure this out. This is a PITA workaround but at least it's fixable!

[@Lis_T]

Has anything more been done to prevent this issue? Even when I remove the fill styling I'm still unable to see my icon in Elementor (like at all; blank box). This is super frustrating …