When Responsive is not checked, Illustrator will code in a width and height.Additionally, without a width and height the SVG will automatically scale up or down to fill the container, forcing you to always code it to the size you want it. When Responsive is checked, Illustrator will not code in a width and height, which can cause problems in Microsoft Edge and Internet Explorer.The Responsive option: I recommend unchecking Responsive because of the following:

In the SVG export dialog you should pay attention to the settings (don’t just accept the defaults).

Codes SVG the same way as File > Save As (which is not as good as the other methods).Instead of exporting an SVG file, you can copy graphics in Illustrator and paste into a code editor to get the SVG code.Codes SVG files the same way as File > Export.Lets you export multiple SVG files from specific graphics within a single Illustrator file.To fit the artboard to your graphics, choose Object > Artboards > Fit to Artwork Bounds. Uses the artboard to define the size of the SVG.This older export produces less efficient, larger files that are not as cleanly coded as File > Export.Ignores the artboard size and automatically trims to the size of the graphics.

This newer export produces more optimized, smaller files with cleaner code than File > Save As.Ways to Create SVG in Adobe Illustratorįile > Export > Export As (and Export for Screens): When saving SVG (scalable vector graphics) in Adobe Illustrator, there are some things you should know that will affect the quality of the SVG files you produce.ĭisclosure: If you make a purchase using my links to Adobe’s website, I may earn a commission (which helps support me).

Illustrator icon svg