I have created a complex 3d style logo with transparency and other effects in adobe illustrator and later save as SVG file format. However, due to complexity of the logo illustrator or SVG failed to produced a perfect images. Now, I want to know that does SVG supports 3D & complex shapes or it should only be used for 2D images? and does it supports transparency & other effects or would it be better to avoid these things?
There are two images above which we have added for reference, one at top is a JPG image exported through illustrator and the other at bottom is a screenshot of SVG image rendered at internet explorer.
The difference is quite obvious that illustrator couldn’t able to convert shadows & transparency effects perfectly in some places. Even in couple of places, there are some problem at edges which also failed to convert perfectly.
These are the issues which i want to pointed in my original question. Hopefully, my question is now more clear and understandable for all users.
PS. Thanks for all the replies prior to image addition, however I will be looking for some updates, if necessary in this case after the inclusion of preview images.
@born2DIE It would be good if you provided a sample image of your logo. In addition to what @joojaa and @hsawires have said, try the following:
- Even AI doesn’t really support 3d! I Assume you are using the “Extrude & Bevel” tool (Effect > 3D)?
The best way for SVG Compatibility is to break up complex objects into their composite paths. You can do this with Object > Expand Appearance.
Eg: Notice the top right complex 3D Object.
After Expanding Appearance, the complex object has been reduced to paths.
You can apply this process to other complex non 3D stuff on Illustrator as well, including complex transparencies, and any other stuff from the Effects Menu.
- SVG is a pretty extensive format supporting a large number of things. If all else fails, you could also try Inkscape. You won’t be lost coming from the Illustrator World and SVG is supported natively!