Adding CSS loader is important for the user experience, making the feel of your webpage more smooth during the page load or some specific elements such as bigger assets loading. Here is a list of resource of nice CSS and HTML loaders.
Choose a spinner animation that matches your design, you can find lots online, customize them to fit your need. Don’t reinvent the wheel.
Websites with code source of CSS loaders
- https://loading.io/css/ – open-sourced CSS loading animations dedicated for speed, simplicity and dev-friendly.
- https://icons8.com/cssload/en/spinners – CSS spinners – Generator of circular AJAX loaders in pure CSS and HTML
- https://tobiasahlin.com/spinkit/ – A collection of loading indicators animated with CSS
- https://epic-spinners.epicmax.co – Epic Spinners, CSS only. Easy to use. VueJS integration.
- https://freefrontend.com/css-loaders/ – 114 CSS Loaders, great for inspiration too
- https://uicookies.com/css-spinners/ – also good for inspiration
- http://www.css-spinners.com/ – Simple CSS spinners and throbbers made with CSS and minimal HTML markup