LearnQuick Tip: Saving SVG Files in Adobe Illustrator

Mat Helme
writes on May 16, 2013

What’s an SVG, and why do I have to use it? SVG, or Scalable Vector Graphics, are very small in file size and are great for retina displays. Vector graphics have an advantage over pixel formats like .gif or .jpg as they don’t deal with resolution. SVGs can scale to any size and not lose clarity. All SVGs are usually smaller in file size than raster graphics.

Treehouse Illustrator teacher Mat Helme will help you get started saving resolution independent SVG files in this Treehouse Quick Tip.

4 Responses to “Quick Tip: Saving SVG Files in Adobe Illustrator”

  1. This didn’t work for me. It generated an image but gave me non-SVG code, beginning as shown here:

    <image overflow="visible" width="70" height="70" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEYAAABGCAYAAABxLuKEAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJ bWFnZVJlYWR5ccllPAAAA2ZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdp bj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6 eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0 NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJo

  2. Clear and concise. Nice tutorial and easy to follow.

  3. Great tutorial. Much simpler than I was shown how to do it by a colleague. Thanks!

  4. Dariusz Goldmann on June 22, 2013 at 8:46 am said:

    that’s good one:)

Leave a Reply

Learning to code can be fun!

Get started today with a free trial and discover why thousands of students are choosing Treehouse to learn about web development, design, and business.

Learn more