Opret smukke CSS-loadere

Generer brugerdefinerede CSS-indlæsningsanimationer på få sekunder med vores intuitive træk-og-slip-grænseflade. Ingen kodning påkrævet!

Tilpas din indlæser Indlæsertype

Indlæsertype

Color

Size 40px

Speed 1s

indstillinger

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); } }

Sådan bruges

Tilpas din loader ved hjælp af kontrollerne til venstre
Klik på knappen
Kopier den genererede HTML- og CSS-kode
Indsæt den i dit projekt

Populære Loader Eksempler

Pulse Loader

3 Dots Let at implementere

Spinner Loader

Classic 100% CSS

Dual Ring

Double Circle Moderne stil

Bounce Loader

Bouncing Dots Glat Animation

Ring Loader

Ring med Dot Unikt design

Scale Loader

Scaling Dots Lightweight

Sådan bruger du CSS

Grundlæggende implementering

Det er ligetil at bruge CSS-indlæsere, der genereres af dette værktøj. Du skal blot kopiere den genererede HTML- og CSS-kode til dit projekt.

Trin 1: Tilføj CSS

Add the generated CSS code to your stylesheet or in a