12 Dots Scale Rotate
Editor
Select a loader from the catalog
Select a loader from the catalog
to start customizing
Color
180° Ring with BG
180° Ring
270° Ring with BG
270° Ring
3 Dots Bounce
3 Dots Fade
3 Dots Move
3 Dots Rotate
3 Dots Scale Middle
3 Dots Scale
4 Dots Gooey
4 Dots Rotate
6 Dots Rotate
6 Dots Scale Middle
6 Dots Scale
8 Dots Rotate
8 Dots Rotate Scale
90° Ring with BG
90° Ring with Gradient
90° Ring
Audio
Ball Triangle
Bars Fade
Bars Rotate Fade
Bars Scale Fade
Bars Scale Middle
Bars Scale
Bars
Blocks Scale
Blocks Shuffle 2
Blocks Shuffle 3
Blocks Shuffle 4
Blocks Shuffle 5
Blocks Wave
Bouncing Ball
Circle Fade
Circles
Clock
Cog 01
Cog 02
Cog 03
Cog 04
Cog 05
Cog 06
Cog 07
Cog 08
Cog 09
Cog 10
Cog 11
Cog 12
Cog 13
Cog 14
Cog 15
Cog 16
Cog 17
Cog 18
Cog 19
Cog 20
Cog 21
Cog 22
Cog 23
Cog 24
Dot Revolve
Eclipse Half
Eclipse
Gooey Balls 1
Gooey Balls 2
Grid
Heart Pulse 2
Heart Pulse 3
Heart Pulse
Hearts
Horizontal Bar
Jump
Loader Wi-Fi
Loader 1
Loader 2
Loader 3
Loader 4
Loader 5
Loader 6
Loader 7
Loader 8
Loader 9
Loader 10
Oval
Pac-Man
Puff
Pulse 2
Pulse 3
Pulse Multiple
Pulse Ring
Pulse Rings 2
Pulse Rings 3
Pulse Rings Multiple
Pulse
Ring Resize
Rings
Spinner Double
Spinner Multiple 2
Spinner Multiple
Spinner
Spinning Circles
Square
Tadpole
Tail Spin
Three Dots
Wi-Fi Fade
Wi-Fi
Wind Toy
No loaders match your search.
Free Animated SVG Loaders
A curated library of lightweight loading animations. Customize colors and speed, then export as SVG or GIF for your projects.
Curated Collection
Browse 50+ hand-picked SVG loading animations organized by category — spinners, bars, dots, and abstract shapes. Each loader is lightweight and ready for production use.
Customize Colors
Change the color of any loader with the built-in color picker. Match your brand palette instantly without editing SVG code.
Adjust Speed
Control animation speed to match the feel of your application. Slow it down for a calm experience or speed it up for perceived performance.
Multiple Export Formats
Export as optimized SVG for web, animated GIF for broader compatibility, or copy the SVG code directly into your HTML.
Frequently Asked Questions
Yes. All loaders in the collection are open-source and free for personal and commercial use. No attribution is required.
Copy the SVG code and paste it directly into your HTML. The animation is embedded inside the SVG — no JavaScript or CSS needed. You can also download the SVG file and reference it with an img tag.
SVG loaders are resolution-independent, meaning they stay sharp on retina displays. They are also significantly smaller in file size, support color customization via CSS, and do not have the limited color palette of GIF files.
SVG loaders scale to any size. Simply set the width and height in CSS or inline attributes. Because they are vectors, they remain crisp at 16px icons or full-screen overlays.