Luo kauniita CSS-lataajia

Luo mukautettuja CSS-latausanimaatioita sekunneissa intuitiivisella vedä ja pudota -käyttöliittymällämme. Koodausta ei tarvita!

Mukauta kuormaajaa

Latauslaitteen tyyppi

Color

Size 40px

Speed 1s

Lisäasetukset

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

Käyttö

Mukauta lataajaa vasemmalla olevilla säätimillä
Napsauta "Luo CSS" -painiketta
Kopioi luotu HTML- ja CSS-koodi
Liitä se projektiisi

Suosittuja esimerkkejä lataajista

Pulse Loader

3 Dots Helppo toteuttaa

Spinner Loader

Classic 100% CSS

Dual Ring

Kaksoisympyrä Moderni tyyli

Bounce Loader

Pomppivat pisteet Sileä animaatio

Rengaslatausrengas

pisteellä Ainutlaatuinen muotoilu

Scale Loader

Scaling Dots Lightweight

Kuinka käyttää CSS-lataajia

Perustoteutus

Tämän työkalun luomien CSS-lataajien käyttö on yksinkertaista. Kopioi vain luotu HTML- ja CSS-koodi projektiisi.

Vaihe 1: Lisää CSS

Add the generated CSS code to your stylesheet or in a