Skip to main content
M
Maddie32892544vne5
Participant
October 13, 2023
Question

SVG export issues

  • October 13, 2023
  • 2 replies
  • 479 views

I'm trying to export icons as svgs out of Illustrator. 

 

The icon/asset looks fine in Illustrator, but once I upload it into the webpage I'm designing, the icon has different/combined paths and is black/blacked out instead of a navy blue color I'm using.

 

I've noticed a common theme with the icons, any that have a small circle in the icon are the ones having issues. I didn't create these icons, I downloaded this file from Shutterstock. 

 

I'm new to Illustrator and I'm trying everything I can google to fix the issue, but now I'm turning to you all! Is there a way to flatten the object? Remove a compound path? I'm really not sure what I need to do. 

 

I've tried grouping and that doesn't work. 

 

I've attached one of the icons that has said circles (as an svg). 


Thanks for any help! 

    2 replies

    Monika Gause
    Community Expert
    Monika GauseCommunity Expert
    Community Expert
    October 13, 2023

    That attached SVG looks dark blue. Is that the correct color? When you open it on the forum's web site?

     

    If that is correct, then possibly the issue is with your website builder.

    M
    Maddie32892544vne5Author
    Participant
    October 14, 2023

    The outline is dark blue, yes. I think the issue is with the circles that are in there. I'm having issues with the other icons that also have those circles in them. Not sure what's going on. 

    Sergey Osokin
    Sergey Osokin
    Inspiring
    October 13, 2023

    How do you save SVG? Try three different methods: Save As, Export As, Export for Screens.

     

    I have your file open in both my browser and Illustrator. How do you add SVG to the web page code?

     

    I suggest another test: select all Object > Path > Outline Stroke objects and save the SVG. Check the color and objects in the browser to see if they are correct.

      M
      Maddie32892544vne5Author
      Participant
      October 13, 2023
      Hi,

      I’m just importing it into Duda (website builder), I’m not actively
      building it into any code.
      Terms & ConditionsAccessibility statement
      Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices