About this tool
Create a pure-CSS loading spinner in ring, dots or bars styles with custom size, colour and speed, then copy the CSS and keyframes. The preview animates live in your browser.
Frequently asked questions
Does the spinner need any images or JavaScript?
No — it is built only from HTML elements and CSS keyframes, so it works in any page without extra assets.
How do I change how fast it spins?
The speed slider sets the animation duration in seconds; a smaller value spins faster and a larger value slower.