Lag vakre CSS-lastere

Generer tilpassede CSS-lasteanimasjoner på sekunder med vårt intuitive dra-og-slipp-grensesnitt. Ingen koding kreves!

Tilpass lasteren din

Type laster

Color

Size 40px

Speed 1s

Avanserte alternativer

Preview

.loader { border: 4px solid #f3f3f3; border-radius: 50%; border-top: 4px solid #165DFF; width: 40px; height: 40px; animation: spin 1s linear infinite; }  @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }

Hvordan å bruke

Tilpass lasteren ved hjelp av kontrollene til venstre
Klikk på "Generer CSS"-knappen
Kopier den genererte HTML- og CSS-koden
Lim det inn i prosjektet ditt

Eksempler på populære lastere

Pulslaster

3 Dots Enkel å implementere

Spinner laster

Classic 100% CSS

Dual Ring

Dobbel sirkel Moderne stil

Bounce laster

Sprettende prikker Jevn animasjon

Ringlaster

Ring med prikk Unikt design

Vektlaster

Skalering av prikker Lightweight

Hvordan bruke CSS-lastere

Grunnleggende implementering

Det er enkelt å bruke CSS-lasterne generert av dette verktøyet. Bare kopier den genererte HTML- og CSS-koden til prosjektet ditt.

Trinn 1: Legg til CSS

Add the generated CSS code to your stylesheet or in a