Programming/JavaScript & TypeScript
[Font Awesome] spinner 아이콘 회전 시키기
Bonita SY
2020. 11. 3. 20:40
728x90
fontawesome
fa-spin 또는 fa-pulse 을 붙혀주면 됨
- fa-spin : 회전 애니메이션
- fa-pulse : 스타카토 느낌의 애니메이션
▼ 아이콘 회전 X
<div class="fa-3x">
<i class="fas fa-spinner"></i>
<i class="fas fa-circle-notch"></i>
<i class="fas fa-sync"></i>
<i class="fas fa-cogn"></i>
<i class="fas fa-spinner"></i>
<i class="fas fa-stroopwafel"></i>
</div>
▼ 아이콘 회전 O
<div class="fa-3x">
<i class="fas fa-spinner fa-spin"></i>
<i class="fas fa-circle-notch fa-spin"></i>
<i class="fas fa-sync fa-spin"></i>
<i class="fas fa-cog fa-spin"></i>
<i class="fas fa-spinner fa-pulse"></i>
<i class="fas fa-stroopwafel fa-spin"></i>
</div>
https://fontawesome.com/how-to-use/on-the-web/styling/animating-icons
Font Awesome
The world’s most popular and easiest to use icon set just got an upgrade. More icons. More styles. More Options.
fontawesome.com
728x90