DEV Community

Cover image for β­• Generate 250+ CSS-only Loaders & Spinners -
Fatih Telis
Fatih Telis

Posted on


β­• Generate 250+ CSS-only Loaders & Spinners -

Hi guys πŸ‘‹,

I've an all-in-one online toolbox project called and I've been building a fancy CSS loading animation generator for some time. The most time-consuming tool that I coded so for was by far this CSS loading generator which took 12+ days to finalize. It offers 250+ CSS loading animations from different categories such as spinners, progress bars, dot/bar/shape loaders, pulse loaders, blob loaders, hypnotic loaders and so on.

I also like to get fancy loaders from Codepen or similar sites and use in my projects, but the main problem is to customize these loaders with the theme of your website. You can customize colors, size, and animation speed in this tool by just using the settings screen from UI.

Here are some screenshots πŸ–ΌοΈ:

CSS loader generator

CSS loading animation generator

CSS spinner generator

You can access CSS loader generator from the link below.

I've used publicly shared CSS animations created by Temani Afif (who is also a writer I follow - @afif), Jhey Tompkins and other anonymous creators. I've used code of these CSS loaders as reference and make them dynamic & customizable.

I've written a blog post about my online tools project recently and got really kind feedbacks from you. I really appreciate your support.

I'm open to any suggestions. Feel free to comment if you think I can somehow improve the tool.

Top comments (2)

gitcommit100 profile image

Wow Fatih !! Best pure CSS loaders I have ever seen and so much customizable tooπŸ’•πŸ‘Œ

fatihtelis profile image
Fatih Telis

Thanks buddy. πŸ˜‰ I'll increase the number of loaders and categories soon. πŸŒ€