CSS-Ladespinner-Generator
Spinner wie Ring, Punkte oder Puls wählen, Farbe und Tempo anpassen und als reines CSS kopieren
도구를 불러오는 중…
🔒 Alles läuft zu 100 % in Ihrem Browser. Ihre Dateien und Eingaben werden niemals auf einen Server hochgeladen.
Wähle aus fünf Ladespinner-Stilen – Ring, Doppelring, Punkte, Puls und Balken – und passe Größe, Farbe und Tempo mit einer Live-Vorschau an. Der erzeugte Code ist reines HTML und CSS ohne Bilder oder externe Bibliotheken und lässt sich so leichtgewichtig in jedes Webprojekt einbauen.
Anleitung
- Wähle die Registerkarte des gewünschten Spinner-Stils (Ring, Doppelring, Punkte, Puls oder Balken).
- Passe Größe, Stärke und Tempo über die Regler sowie die Farbe an und prüfe die Vorschau.
- Hole dir den Code über „HTML kopieren" und „CSS kopieren" (oder alles kopieren).
- Füge das HTML an der Ladeposition ein und das CSS in dein Stylesheet – fertig.
FAQ
- Werden die eingegebenen Werte an einen Server gesendet?
- Nein. Stilauswahl, Vorschau und Code-Erzeugung laufen ausschließlich im Browser des Nutzers ab. Keine Werte werden an einen Server gesendet oder gespeichert.
- Brauche ich Bilder oder externe Bibliotheken?
- Nein. Der erzeugte Code besteht nur aus reinem HTML und CSS-Animationen (@keyframes) und funktioniert daher ohne GIF-Bilder oder JavaScript-Bibliotheken.
- Wie zentriere ich den Spinner?
- Gib dem umschließenden Elternelement display:flex; justify-content:center; align-items:center; mit. Farbe und Tempo passt du einfach an, indem du die Werte im erzeugten CSS änderst.