Feed Pricing Sign In Try it free

SVG Flipbook

Make frame-by-frame layer animations with any SVG editor.

SVG Flipbook is an online application for animating your SVG without code. It displays an animated version of your SVG with each layer as a single frame in the animation. When you save your SVG in your existing vector graphics editor you'll see an updated version of the animation in the SVG Flipbook app. You can edit the SVG, then save, and see the animated changes straight away. When you're done you can export your animated SVG to use it on the web. You can use whatever SVG editor you like to do the editing. Both Adobe Illustrator and Inkscape work great.

SVG Flipbook walk cycle screencast

How to use the app

First, create an account and log in, then you will be able to open the app. While you are editing the SVG in your vector graphics program, open the same file in the SVG Flipbook app. When you hit save in your SVG editor it will "live reload" in the app and you will see your changes playing.

Customise frames

You can customize frame timing and behaviour by editing the layer name in your vector graphics program:

SVG Flipbook frame options

Export to animated SVG

You can export your finished creation to an animated SVG. This will save a copy of your SVG with the animation script bundled. When you open the SVG in a web browser or add it to an <object> tag you will see the animtion playing.

The animation above was exported from SVG Flipbook and included in this HTML page.

How to embed the SVG in HTML

You can use the following code to embed your animated SVG in an HTML file:

<object data="FILENAME.svg" type="image/svg+xml">
  <img src="FILENAME.svg" />
</object>

Pricing

$11 / month

Start your 14 day trial.
No credit card required.

Start free trial

Open source

Did we mention the app is open source? Check out our source code on GitHub.

Use our fully hosted SVG Flipbook(pro) online web application, or you can host the open source edition yourself.

Founder's pledge

My name is Chris McCormick and I made SVG Flipbook. I know reliable software is important to you, especially if you depend on it for your work. I pledge to keep this web app running with good uptime into the future. I made it open source because I strongly believe that people should have access to the source code of the software they run. That means you can be secure in the knowledge that the app won't suddenly go away. Please get in touch if there's anything I can do for you.