How to Save Adobe Illustrator Files in Other Formats: JPEG, PNG, SVG, Etc. | Tips & Tricks

How to Save Files in Other Formats: JPEG, PNG, SVG, Etc.

Advertisement

By default, Adobe Illustrator saves files in the AI format. This is ideal for when you’re working on projects, or for saving a master copy of your work.

But when the times comes to print or share the finished product, post it online, or import it into other programs, you will need to save it into a different format.

Adobe Illustrator gives you lots of options for this. The right one to choose depends on how you want to use your resulting image. Let’s take a look at the best formats to use and how to use them.

Saving Artboards in Adobe Illustrator

Before we look at how to save files in specific formats, it’s important to know how Illustrator handles artboards


The Beginner’s Guide To Adobe Illustrator




The Beginner’s Guide To Adobe Illustrator

Want to get started learning Adobe Illustrator, but feel overwhelmed? With easy-to-follow instructions and plenty of annotated screenshots, this manual makes learning Illustrator simple.
Read More

, and how to save artboards as separate files.

Artboards are like different pages within an Illustrator file. They can be combined into a single image, but you can also save them out separately.

Most of the ways to save Illustrator files let you choose how you want to handle artboards, and this affects what your final, exported image will look like. In most cases, you choose what to do through an option in the Export screen.

save artboards illustrator

Here’s what you should do:

  • If you want to save multiple artboards as separate files, check the Use Artboards box. Then select either All to save all the artboards, or enter a Range (such as 2-4) to specify which artboards to save.
  • When you have objects placed outside of an artboard (like if it’s overlapping the edge), check the Use Artboards box. This will ensure that your final image only contains what’s inside the artboard, and that the rest is cropped out.
  • If all your artwork is within the artboard, and you only have one of them, clear the Use Artboards box. This will produce an image that is cropped to the bounds of the objects within in, with all white space removed. This is especially handy for outputting square or rectangular shaped objects.

artboards illustrator

Saving High Resolution JPEGs in Adobe Illustrator

For an illustration, infographic, or anything that needs to be printed like a business card


How to Design a Business Card in Adobe Illustrator




How to Design a Business Card in Adobe Illustrator

Designing a business card in Adobe Illustrator is easy and helps you stand out. Just follow these steps to get a beautiful card in a matter of minutes.
Read More

, the best option is to output it as a high resolution JPEG.

Ideally, you should design your artwork at roughly the size at which you want to output it. Although Illustrator images can be resized without any loss of quality, you’ll find that the sizing between objects—and especially the kerning in text—needs to be tighter at larger sizes than smaller sizes.

save as jpeg

If you haven’t previously worked in this way, create a new document, paste in your artwork and tweak it to taste. You’re now ready to save your high res JPEG.

  1. Go to File > Export > Export As. Type in a file name and set Format to JPEG.
  2. Set how you want to save your artboards, then hit Export to continue.
  3. In the JPEG Options screen change the Color Model if you need to, and choose a quality.
  4. Under Options, set the output resolution. Screen (72dpi) will produce a file the same size as your original document and should be okay for web use. Choose High (300dpi) for a high res image. This will be good enough for printing.
  5. Click OK to save the file.

Saving Adobe Illustrator Files as PNG

When you need to save an image like a logo or icon for use on the web, especially if it has a transparent background, then you might want to save it as a PNG file.

save as png

In order to support standard and high resolution displays you should export your file at different sizes. You can do this automatically.

  1. Go to File > Export > Export for Screens.
  2. Select the Artboards tab. If there’s more than one artboard in your image, choose the ones you want to output.
  3. Under Formats, set Format to PNG and Scale to 1x.
  4. Click Add Scale. This will create the settings for a second image, so set the Scale option to a new relative size. 3x, for example, will output an image three times taller and wider than the original.
  5. Add more sizes if you need them.
  6. Click Export Artboard to save your images.

Saving Adobe Illustrator Files as SVG

A better, more modern way to export graphics like icons and logos for the web is by using the SVG format. Short for Scalable Vector Graphics, SVG is actually an XML-based markup language.

While you can output files that you can link to in your web page, you can also save the image as a piece of code that you can paste directly into your HTML file. You can then edit this using CSS. It’s a very efficient way of adding effects and animations to your images.

There are other benefits: the images are lightweight, and because they’re vectors you can resize them easily. There’s no need to output multiple sized images for different screen resolutions.

save as svg

There are a couple of ways to create an SVG. Using Save As creates a larger file for working on. To create a final image you can use in your projects use the Export option.

  1. Go to File > Export > Export As.
  2. Set the Format to SVG and click Export.
  3. Set Styling to Internal CSS. This places all the styling information in a