Copy link to clipboard
Copied
Hi there
I am just delving into how to work between .AI and saving/exporting to SVG
I have run into a strange issue, though. Everything looks great in my .AI file. But then I save as an SVG and all my gradients stop blending correctly. See images for before and after. (the after is how the file looks if I open the SVG back up in Illustrator, Preview the file, or if I place the graphic into an InDesign document... actually looks even worse placed in InDesign but I won't hurt your eyes).
Additional context: I licensed a stock image and modified it. So I do wonder if it's
What am I missing? Anyone run into a similar issue?
Cheers Jennifer
Don't import an SVG back in Illustrator unless you absolutely don't have any other possiblity.
SVG is not a work file format. It's meant for presentation.
Does it work in the browser?
Hi. SVG is not the best format for export images with gradients. I suggest you use another format like jpg or png.
Copy link to clipboard
Copied
Don't import an SVG back in Illustrator unless you absolutely don't have any other possiblity.
SVG is not a work file format. It's meant for presentation.
Does it work in the browser?
Copy link to clipboard
Copied
Hi. SVG is not the best format for export images with gradients. I suggest you use another format like jpg or png.
Copy link to clipboard
Copied
Hola, tengo un problema al copiar un trazo de un archivo ai. a otro, no hice ninguna modificación y hasta el dÃa anterior funcionaba con normalidad, por alguna razón me aparece este código:
<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In -->
<svg version="1.1"
xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:a="http://ns.adobe.com/AdobeSVGViewerExtensions/3.0/"
x="0px" y="0px" width="193.7px" height="193.7px" viewBox="0 0 193.7 193.7" style="enable-background:new 0 0 193.7 193.7;"
xml:space="preserve">
<style type="text/css">
.st0{fill:#3FA9F5;}
.st1{fill:#061C4C;}
</style>
<defs>
</defs>
<path id="XMLID_18_" class="st0" d="M193.7,193.7v-15.6c0,0-18.4-22.9-58,1.1"/>
<path id="XMLID_17_" class="st1" d="M0,127.9c0,0,8.4,31.9,52.8,65.8H0V127.9z"/>
<path id="XMLID_16_" class="st0" d="M193.1,32.2c0,0-9.1-5.5-29.5-6.8L123.8,0.1l69.3,0L193.1,32.2z"/>
<path id="XMLID_15_" class="st1" d="M0,37.1c0,0,20.9,11.7,56.8-8.1c0,0,50.7-35.3,106.1-3.7l0.7,0c0,0-17.1-16.9-37.7-25.4L0,0
V37.1z"/>
</svg>
Porfavor espero que puedan ayudarme.
Copy link to clipboard
Copied
If you want perfection export the gradient objects as solids and then use css within the svg to create the gradient. It can be a long process but the results are worth it