SVG Artista Alternatives

SVG Artista

SVG Artista is a spin-off project of Animista.net. A lot of Animista users have been asking us about how we made the Animista splash screen animation. Therefore we decided to develop a tool that would simplify the process of creating such an animation. It was originally meant to be a part of Animista, but as it soon outgrew our original idea it made sense to make it a separate project.

SVG Artista is a tool that helps you animate stroke and fill properties in your SVG images with plain CSS code. It should work fine with path, line, polyline, rect, circle, ellipse and polygon elements. It cannot animate SVG gradients though, so please keep that in mind.

SVG Artista generates the necessary CSS and updates the SVG code so that it can be easily animated by assigning the .active class to the SVG element. It doesn't rely on third-party JS libraries to work, although you will likely want to use one to dynamically set the .active class on some kind of trigger (e.g. on scroll into view). Depending on your preference, you can generate either the CSS transition or CSS animation code.

CSS animated SVG is fairly well supported and should work in all modern browsers. That said, SVG Artista generated code is provided as-is, without warranty of any kind. Use your judgment and test it in your target environment and browsers before using it in production.