PathAnimator

SVG to animation: turn any SVG into a Fourier drawing

Upload an SVG and every path in it is traced by its own chain of spinning circles. Logos, icons and line art work best. It runs in your browser, so the file never leaves your computer.

Your Brand Could Be Here

Sponsor us and feature your banner here. Any user clicking on it will be redirected to your page in a new tab.
Plus, get exclusive sponsor placements across the app.

Type something

Showing an example logo until you upload your own.

How it works

  1. 1Upload an SVG file below, or try the example.
  2. 2Watch each path get traced by circles. More circles make sharper corners.
  3. 3Open it in the editor to change colors, speed and camera, then export a video, GIF or embed code.

Tips

  • Outlines and strokes both work: paths, polygons, circles, ellipses, rectangles and lines are all read.
  • Simple logos with a few clean paths look best. Very detailed SVGs with hundreds of tiny paths get busy.
  • Export WebM or GIF with a transparent background to drop the animation onto a website or slide.
  • Text in an SVG must be converted to outlines first, since fonts aren't stored as paths.

Questions

Can I animate an SVG logo for free?
Yes. Upload the SVG, and PathAnimator redraws every path with spinning circles. Exporting MP4, WebM, GIF, PNG or SVG is free and needs no account. The file is processed in your browser and isn't uploaded anywhere.
Why does my SVG show nothing?
PathAnimator reads paths, polygons, polylines, lines, rectangles, circles and ellipses. Text that hasn't been converted to outlines, embedded images and fills without any shape aren't drawn. In Figma or Illustrator, outline the text and export again.

More ways to animate