From the course: Creating Web Media

Unlock this course with a free trial

Join today to access over 22,600 courses taught by industry experts.

SVG symbols with Illustrator

SVG symbols with Illustrator - CSS Tutorial

From the course: Creating Web Media

Start my 1-month free trial Buy for my team

SVG symbols with Illustrator

“

- [Narrator] Hi, this is Chris Converse, and in this episode, we're going to take a look at creating symbols in an SVG using Adobe Illustrator. Now, if you're using the same shape in your SVG file in a few different places, that code could be replicated in your SVG file several times. A symbol allows you to define the shape once, and then reference it as many times as you want throughout your graphic. This makes your final graphic smaller and more efficient, and will also allow you to quickly update the symbol art, either back in Illustrator or by simply modifying the code within the SVG file. And the best part is, Illustrator will write all of the SVG code for us. Now, if you'd like to follow along, grab a copy of the exercise files, and let's begin by opening the file named forecast_layout in Illustrator. So here in Illustrator we can see that we have this cloud shape here, and we've actually used this a bunch of times in this layout, in different sizes, in combination with other…

Contents