[Font Awesome] spinner 아이콘 회전 시키기

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