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.

Get SVG from Photoshop

Get SVG from Photoshop - CSS Tutorial

From the course: Creating Web Media

Get SVG from Photoshop

- [Chris] Hi, this is Chris Converse and in this episode we'll take a look at how we can export SVG artwork directly from Photoshop. There are two ways to specify SVG as the export type, however, we'll need to make sure that the artwork is created using shape layers in Photoshop. Otherwise, we'll get a base64 encoded bitmap image instead of vector artwork. If you'd like to follow along with me, download the exercise files and let's begin by opening everyday_things.psd in Photoshop. Once you have the Photoshop file opened, you'll see all of these layers in the layers panel and we have a composition showing up here on the canvas. At the very top we have a logo file, which is this logo file here, everyday things. This is an Illustrator smart object, we'll talk about that more in a few minutes. I also have this same artwork as a shape layer and I'll show you how to convert that from Illustrator. Then, down here on the third layer, we have this bowl shape, which is this icon down here…

Contents