CSS loaders, preloaders & spinners
9 demos · 🔗 Live gallery — every demo is deployed to GitHub Pages.
| Demo | Description | Preview |
|---|---|---|
3d-spinner-Pre-loader |
Three concentric rings flipping in 3D as a page preloader (CSS3) | 🔗 Live |
Animated-cards-preloader |
Four stacked cards rotating around the X axis as a loading animation (CSS3) | 🔗 Live |
Arabic-Calligraphy-Stroke-Loader |
SVG stroke-dash loader that writes the Arabic word أهلاً letter by letter | 🔗 Live |
Bird-preLoader |
Bird shape acts like a preloader | 🔗 Live |
Crescent-Loader |
Crescent moon rocking beside a twinkling star, pure CSS with a reduced-motion fallback | 🔗 Live |
Linkedin-loader |
LinkedIn-style splash loader: logo with an animated progress bar (CSS animation) | 🔗 Live |
Material-PreLoader |
Material UI Preloader with vanilla CSS | 🔗 Live |
SpinningPreLoader |
Spinning circles preloader | 🔗 Live |
Square-Loading-Animation |
loading animation using css3 | 🔗 Live |
Each folder is a standalone demo. Click 🔗 Live to view it running, or open the folder for source. Previously separate repositories, merged here to keep the profile clean while preserving every file.