Generator Spinner CSS — Animasi Loading

Spinner dan loader memberi tahu pengguna bahwa konten sedang dimuat. CSS spinner lebih baik dari gambar GIF — dapat diskalakan, mudah dikustomisasi, dan lebih ringan.

Jenis Spinner CSS

• Roda berputar: spinner lingkaran klasik dengan border
• Lingkaran berdenyut: animasi scale atau opacity
• Tiga titik: lingkaran yang dianimasikan secara berurutan
• Progress bar: indikator kemajuan linear
• Skeleton: placeholder berbentuk konten

Praktik Terbaik

Gunakan spinner untuk operasi yang berlangsung lebih dari 300 ms. Untuk operasi di atas 1 detik — tampilkan spinner dengan deskripsi. Skeleton loading lebih baik untuk layout kompleks.