Scalable Vector Graphics (SVG) is an XML-based vector image format for two-dimensional graphics with support for interactivity and animation. You can now import SVG files in to Animate. Some of the import options work the same as the import options for Adobe Illustrator files.

You can use one of the following options to import SVG files in to Animate:

  • Using the File Import option: Click  File > Import > Import to Stage, or Import to Library and select the SVG file.
  • Drag and drop an SVG file directly on to the stage.
  • Using SVG assets stored in your CC library: Drag and drop the asset from CC library directly on to stage or your document’s library.
  • Using the existing file import JSFL API: document.importFile()

You can choose to covert the layers in your SVG files as follows:

  • Import all paths to the same layer and frame: Choose this option to import all the layers in your SVG to a single Flash layer.
  • Import each path to different layer: Choose this option to import each layer in your SVG to a separate Flash layer. 
  • Import each path to different keyframe: When converting SVG layers to keyframes, the SVG file is imported as a movie clip; converting the SVG layers to Flash layers, or as a single Flash layer, imports the SVG file as a graphic symbol. The resulting movie clip or graphic symbol contains all of the content of the SVG file imported to its timeline, as if the content were imported to the Stage.
  • Change stage size to match artwork size: Choose this option if you want to increase or decrease the stage size to the size of the artwork in the SVG file that you are importing.
Import SVG options