CSS Loader / Spinner Generator

Choose an animation style, customize color, size, and speed, then copy the pure CSS code ready to drop into any project.

Loader style

Color

Size (px) 48px

Speed (s) 0.8s

Preview

CSS code

Runs entirely in your browser. Nothing is uploaded.

How it works

STEP 1

Select from 8 animated loader types including spinners, dots, bars, and more.

STEP 2

Adjust the color, size, and animation speed to match your design.

STEP 3

Click Copy and paste the pure CSS directly into your stylesheet — no JS needed.