A loader in your own colours.

Make a loading spinner or bouncing dots in your browser, nothing uploaded, and save a GIF, an MP4 or a WebP with a clear background. No watermark.

By Suraj Kumar4 November 20265 min read

A loading animation tells someone that something is happening and that it is worth waiting. It should be small, loop without a jump and match the rest of the page. KeepSimp's loading animation maker makes one in your browser, in your colours, and saves it without a watermark.

Start from three bouncing dots.

The loading animation maker opens on three dots that bounce one after another, round and round, once a second. Change their colour, their size or how high they jump, or how long one round lasts.

Each dot starts its bounce a little after the one before. That gap is only where its first key sits on the timeline: move the keys to change it.

Or draw a loader of your own.

A ring that goes round is an ellipse with a dashed stroke and no fill, keyed to turn a full circle with Steady easing so it never slows. Bars that grow in turn are rectangles with their size keyed, each a little later than the last.

Set the timeline to loop. For a loop with no jump, make the last key the same as the first, as the starter does.

Save it with a clear background.

This page already knows a loader usually goes on a website or in an app, so Export makes an animated WebP with a clear background, to lay over any page. A GIF plays in every app but keeps only fully clear or fully solid pixels, and 256 colours at most in a frame, so soft edges and gradients can look rough. An MP4 or WebM video has no clear background at all.

Each file is made on your device and opened again to be checked before it is offered.

Be kind to people waiting.

W3C's accessibility guidance counts a loading animation shown on its own as something people need not be able to stop. Anything else that starts by itself and moves for more than five seconds beside other content must have a way to pause, stop or hide it.

Some people ask their device for less motion. A website can tell, through the prefers-reduced-motion setting, and show a still frame instead: save one as a PNG from the same project.

A little less theory. A little more doing.

Try it on your own terms, with a free browser tool.

Try the tool