Easy Animation for Web Design

SVG Loader Animation Made Easy

SVGCircus is an awesome web tool to help you on your stressed-for-time web design project. Use it to make vector based, CSS animated loading icons for your sites and web apps.

Choose from a number of ready to use presets and customise the colours to suit your web design, or use the straightforward interface to quickly build-up your own. No coding required! When you have everything looking on-brand and animating smoothly, just export the SVG and give it to your development team to use on the site.

Why use SVG loader icons? Can’t I just load up a GIF? Sure you could, but CSS-animated SVG has a number of benefits over GIF animations. For one it is vector based, so it is easy to make it fully-responsive. It will scale up or down to any resolution or pixel-density without having to have multiple files made by you. It’s also all in the code, which means less HTTP requests and your site loading slightly faster. Web design should always take loading times and accessibility into consideration, and this tool makes it a no-brainer.

Another CSS animation tool to check out is Stylie. It’s not limited to loading icons or SVG, but still has an easy-to-use interface for those who are scared of CSS animation syntax.

Stylie

Hopefully these two tools will help streamline your web design workflow and make your sites even better!