top of page

Best SVG Export Settings: Illustrator

The Print Production Expert I work with recently had a website department ask for a differently formatted SVG file of a new logo. Apparently, the developers were having a problem with the SVG logo files provided, due to the fact that when exported from Illustrator, the coding in the SVG file had viewbox coordinates of "x=0px, y=0px" and was not able to be responsive in their website CSS.

So.... just in case I run into this down the road (I think it was for a Wordpress website), I wanted to share this info here to remember to Export SVGs with "Object IDs" set to Minimal, and with "Minify" and "Responsive" checked in the Illustrator SVG Options export. See details below:

How to create an Adobe Illustrator Responsive SVG:


From the Adobe Illustrator menu go to File > Export > Export As...


Name the file and select ".svg" for the output file type.


A popup will come up. Please use the following settings in the screenshot below:



Happy designing!

3,725 views

Recent Posts

See All

Comments


Reach out with questions or for a free design estimate:

As a website designer and graphic designer, I love sharing great tips and tools that make designing easier. As part of my website design services, I train clients on how to update their websites or to do their own SEO (search engine optimization), so I post many of these tips for my clients to train them how to use Wix and other tools to keep their website up-to-date. Keeping websites current is the best way to get found and to keep people coming back to your website. 

Check out all my Design & SEO tips and resources in my blog

bottom of page