I made 100 more CSS loaders for your next project

Temani Afif - Jun 1 '21 - - Dev Community

not 100, not 200 but 300! Yes, a new collection and a total of 300 CSS loaders.

This time, I am going to rely on more elements to create the loaders ... No, I am joking 😜, still only one <div> per loader, nothing more!

Let's go!


Also available online 👇

css-loaders.com


Table of content


The Classic III

The Dots III

The Hypnotic II

The Bars II

The Spinner III

The last spinner is detailed in a Stack Overflow answer I gave

The Dots vs The Bars

They start as friends but ...

To be continued ...

The Nature

The Time

The Shapes III

The Hungry

The Discord

Someone challenged me so I had to do it.

It's not a perfect replicate but close enough 😁

The Ben

A last one for the fun. I added a click handler to avoid the spoils. Click and wait until the end

A small joke to remind you that even if you use a loader, your website need to be fast 😉 and yes Ben is done with pure CSS, I am not using any image. I know it's crazy...


That's it!

I hope you enjoyed this 3rd collection. If you want more don't forget to ❤🦄! If you have some funny or crazy ideas of loaders you want me to do, leave a comment 👇

I don't do only loaders if you want more fun:

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .