How To Create Svg With Illustrator

How to Create SVG Files In Illustrator YouTube

The Scalable Vector Graphics (SVG) format is an open standard created by the World Wide Web Consortium (W3C) for two-dimensional vector graphics. It is widely used for web graphics and is supported by all major web browsers. Vector graphics are an excellent way to create graphics that can be scaled to any size without losing clarity. This makes them perfect for use in web design, where images need to be resized to fit different screen sizes or design requirements. Illustrator is the industry standard for creating vector graphics, and it is a great tool for creating SVG files.

Creating SVG in Illustrator is easy and straightforward. It only requires a few steps and the results are high-quality, scalable vector graphics. This article will guide you through the process of creating SVG files in Illustrator in a few simple steps.

Step 1: Launch Illustrator and Open a New Document

The first step in creating an SVG file in Illustrator is to launch the program and open a new document. To do this, click on the “File” menu at the top of the screen and select “New”. This will open a dialog box where you can specify the size of your document and the color mode. Once you have selected the size and color mode, click “OK” to create the new document.

Step 2: Design Your Vector Graphic

The next step is to design your vector graphic. You can use the tools in Illustrator to draw shapes, type text, or import images and graphics. For this example, we will create a simple vector graphic with a few basic shapes. To do this, select the Rectangle tool from the toolbar and draw a rectangle on the artboard. Next, select the Ellipse tool and draw a circle inside the rectangle. Finally, select the Line tool and draw a line connecting the two shapes.

Step 3: Export the File as an SVG

Once you have designed your vector graphic, you can export it as an SVG file. To do this, click on the “File” menu and select “Export”. This will open a dialog box where you can specify the file format and the name of your SVG file. Select “SVG” as the file format and click “Export”. This will create an SVG file with your vector graphic.

Step 4: Clean Up the SVG File

The final step is to clean up the SVG file. This step is important because it will reduce the size of the file and make it easier to use in web design. To do this, open the SVG file in a text editor and look for any unnecessary code. For example, you can remove any code that is adding extra styling or unnecessary attributes. Once you have cleaned up the code, save the file and you are ready to use it in your web design project.


Creating SVG files with Illustrator is easy and straightforward. By following the steps outlined in this article, you will be able to create high-quality, scalable vector graphics quickly and easily. With a few simple steps, you can create SVG files that can be used in web design projects of any size.