--- title: "I made 100 CSS loaders for your next project" url: https://daily.dev/posts/i-made-100-css-loaders-for-your-next-project-uhgzkxrmh source_url: https://dev.to/afif/i-made-100-css-loaders-for-your-next-project-4eje type: article source: "Community Picks" author: "Temani Afif" published: 2022-08-15T12:36:38.114Z updated: 2023-12-07T12:02:45.284Z tags: ["css"] reading_time: 1 upvotes: 1566 comments: 97 language: en --- > ## Documentation Index > Fetch the complete documentation index at: https://daily.dev/llms.txt > Use this file to discover all available pages before exploring further. # I made 100 CSS loaders for your next project **[Community Picks](https://daily.dev/sources/community)** · [@afif](https://daily.dev/afif) · 1 min read · 1566 upvotes · 97 comments ## Summary Each loader is done using a single element. Add a class to your div and start loading! Table of content The Classic The Infinity The Dots The Bars The Spinner The Continuous The Progress The Wobbling The Shapes The Pulsing That's it! ## Full article daily.dev links to this article rather than hosting it. Read it at the original source: ## Community discussion Top comments from developers on daily.dev. **@the\_deep** · 6 upvotes > It's awesome! **@lukejans** · 4 upvotes > i think I love you **@fuadpashayev** · 3 upvotes > Awesome loaders! **@rooneywayne** · 3 upvotes > These animations are so interesting that I finally don't have to worry about not knowing how to write animations. **@shivangm24** · 2 upvotes > Nice, will use them in future! ## Similar posts on daily.dev - [Don’t just attend KubeCon \+ CloudNativeCon, Merge Forward your experience\!](https://daily.dev/posts/don-t-just-attend-kubecon-cloudnativecon-merge-forward-your-experience--l0rpp73x8) · CNCF · 0 upvotes · 0 comments - [Announcing H2 2026 KCDs](https://daily.dev/posts/announcing-h2-2026-kcds-m96goajm1) · CNCF · 1 upvotes · 0 comments - [Two months of Open Community Groups](https://daily.dev/posts/two-months-of-open-community-groups-asf52zhbs) · CNCF · 0 upvotes · 0 comments - [CNCF Unveils Schedule for KubeCon \+ CloudNativeCon Europe 2026](https://daily.dev/posts/cncf-unveils-schedule-for-kubecon-cloudnativecon-europe-2026-ikhcoa5cb) · CNCF · 2 upvotes · 0 comments - [CNCF Debuts KubeCon \+ CloudNativeCon Japan 2026 Schedule](https://daily.dev/posts/cncf-debuts-kubecon-cloudnativecon-japan-2026-schedule-xp5pyudub) · CNCF · 1 upvotes · 0 comments --- Tags: [#css](https://daily.dev/tags/css) [View this post on daily.dev](https://daily.dev/posts/i-made-100-css-loaders-for-your-next-project-uhgzkxrmh)