CSSローディングアニメーション10パターン - サンプルデモ
← 記事に戻る
全10パターン一覧（クリックで一時停止/再開）
1. 回転スピナー
border + rotate
click to pause
2. ドット3つの点滅
animation-delay
click to pause
3. バウンスするドット
alternate + delay
click to pause
4. プログレスバー
横に伸びる
click to pause
5. パルスリング
広がる円
click to pause
6. スケルトンスクリーン
shimmer
click to pause
7. 回転する四角形
3D perspective
click to pause
8. 波形バー
イコライザー風
click to pause
9. Loading...テキスト
content + steps
click to pause
10. グラデーションスピナー
conic-gradient + mask
click to pause