buncha/code & dev/css-loader

CSS Loader Generator

Eight pure-CSS loading animations. Pick a style, set size, speed, and colour; copy the CSS (plus a small HTML snippet for the multi-element ones). No images, no SVG, no JS dependency.

Loader style

Size — 48px

Speed — 1.20s

Color

CSS

.loader {
  width: 48px;
  height: 48px;
  border: 4px solid #dd7c3533;
  border-top-color: #dd7c35;
  border-radius: 50%;
  animation: bt-spin 1.2s linear infinite;
}

@keyframes bt-spin {
  to { transform: rotate(360deg); }
}

Animations run with pure CSS — no JavaScript runtime cost on your site.

Pairs well with

Base64 Encoder / Decoder

UTF-8-safe Base64 encode and decode. Handles emoji…

Binary Converter

Convert text to binary and binary to text.

CSS Background Pattern Generator

Build tileable backgrounds with pure CSS gradients…

CSS Checkbox & Switch Generator

Pure-CSS checkbox and toggle-switch styles that ov…

About CSS Loader Generator

Eight pure-CSS loading animations — spinner, dual ring, bouncing dots, pulse, equalizer bars, ripple, square flip, orbit. Set size, speed, and colour; copy the ready-to-paste CSS.

Everything happens on your device. Close the tab and it's gone.