0

I am trying to export svg using Adobe Illustrator (AI). Exporting as svg is straight forward as save as option is available. I am working with file downloaded from internet. I am new to AI, having experience editing svg in other softwares. Problem is that file contains some gradient elements applied. When i turn visibility off that background gradients, it makes black circles around other gradients with transparency.

My question is what may causing this problem, how to export svg with background invisible as transparent, so that other software and web can handle it properly?

Do AI gradient works differently?

enter image description here enter image description here

2

That depends on how the gradient is done, if the gradient is from one color to another and from 100% opacity to 0%, the SVG will look correctly.

https://codepen.io/danielillo/full/gOORGOd

  • I added more image to question. Result is not expected as it should. the "dot" has black as second gradient color, when background visibility is set to off, it is as expected, but when background visibility is turned on it works as it were transparent instead black. Is this how illustrator works? – LaraFlow Oct 26 at 16:59
  • When both gradients are set to 100% opacity in all colors from where do you want to get a transparency? – Danielillo Oct 26 at 17:04
  • Sorry, transparency in terms, that it shows color from background, instead black(outline of the "dot"). – LaraFlow Oct 26 at 17:07
  • OK, maybe the layer has set a different blend than normal. Select the dot or the whoke layer and check the blend mode at the Transparency Panel. – Danielillo Oct 26 at 17:16
  • Yes, there happened misconception with me, because the software I usually use to work with svg works differently(opposite of illustrator) with gradient stop opacity, in that software you have to set opacity to 0,for similar result. Also it looks like, illustrator gradients renders differently, than web. – LaraFlow Oct 26 at 18:11

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.