Δημιουργήστε Όμορφους Φορτωτές CSS

Δημιουργήστε προσαρμοσμένα κινούμενα σχέδια φόρτωσης CSS σε δευτερόλεπτα με τη διαισθητική διεπαφή μεταφοράς και απόθεσης. Δεν απαιτείται κωδικοποίηση!

Προσαρμόστε τον φορτωτή

φορτωτή

Color

Size 40px

Speed 1s

Προηγμένες επιλογές

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

Τρόπος χρήσης Προσαρμόστε

τον φορτωτή σας χρησιμοποιώντας τα χειριστήρια στα αριστερά
Κάντε κλικ στο κουμπί
Αντιγράψτε τον κώδικα
Επικολλήστε το στο έργο

Δημοφιλή παραδείγματα

Pulse Loader

3 Dots Εύκολο στην εφαρμογή

Περιστρεφόμενος φορτωτής

Classic 100% CSS

Dual Ring

διπλός κύκλος στυλ

φορτωτής

αναπηδά κουκκίδες ομαλό

δαχτυλιδιών

Δακτύλιος με κουκκίδα μοναδικό σχέδιο

Κλίμακα Loader

Scaling Dots Lightweight

Πώς να χρησιμοποιήσετε CSS Loaders

Βασική υλοποίηση

Η χρήση των φορτωτών CSS που δημιουργούνται από αυτό το εργαλείο είναι απλή. Απλώς αντιγράψτε τον κώδικα HTML και CSS που δημιουργήθηκε στο έργο σας.

Βήμα 1: Προσθέστε το CSS

Add the generated CSS code to your stylesheet or in a