>

Getting Started

Getting Started

Export

Exported file formats

Export settings

Export the element's name as ID

Export React Native animations

Export Flutter animations

Using custom fonts in your animated SVGs

Exported Video Formats and Render Codecs Used

Preparing and importing

Preparing your file in Illustrator

Preparing your file in Sketch

Managing projects

Supported file format

Change canvas size

Using the Assets Library

Creating masks in Adobe Illustrator

Creating masks in Affinity Designer

Creating masks in Gravit Designer

Change timeline duration

Animating

Animate an element

Animators and keyframes

Change the element’s origin point

Use ease effects

Create a path animation

Animate on mouse over

Animate on scroll

Animate on click

Create a morph animation

Create an interactive SVG

Reverse animation on mouse out

Create a clipping path animation

Create a clipping mask animation

SVGator Player JS API

Animate Programmatically

Fill and Strokes

Change the color of an element

Modify an element’s stroke

Implementing

Add animated SVG to your website

Add animated SVG to WordPress

Add animated SVG to React websites

Trigger the SVG animation manually using JavaScript

Add animated SVG to React Native

Add animated SVG to Squarespace

Add animated SVG to Vue.js

Add animated SVG in Webflow

Add animated SVG to Angular

How to use SVGator Plugin for WordPress

Add animated SVG to Editor X

Mobile Export Preview

Get the 40% discount for one year of SVGator PRO