폰트어썸 사이트에 나온 아이콘 사이즈 조절 과련 속성을 정리했습니다. 자세한 내용은 링크를 참고하세요.

Relative Sizing

웹브라우저의 디폴트 폰트사이즈 16px 기준으로 상대적으로 사이즈를 지정합니다.

fa-2xs - 0.625em - 10px
fa-xs - 0.75em - 12px
fa-sm - 0.875em - 14px
fa-lg - 1.25em - 20px
fa-xl - 1.5em - 24px
fa-2xl - 2em - 32px

ex)

  <p><i class="fa-solid fa-coffee fa-2xs"></i> When my six o’clock alarm buzzes, I require a pot of good java.</p>
  <p><i class="fa-solid fa-coffee fa-xs"></i> When my six o’clock alarm buzzes, I require a pot of good java.</p>
  <p><i class="fa-solid fa-coffee fa-sm"></i> When my six o’clock alarm buzzes, I require a pot of good java.</p>
  <p><i class="fa-solid fa-coffee"></i> When my six o’clock alarm buzzes, I require a pot of good java.</p>
  <p><i class="fa-solid fa-coffee fa-lg"></i> When my six o’clock alarm buzzes, I require a pot of good java.</p>
  <p><i class="fa-solid fa-coffee fa-xl"></i> When my six o’clock alarm buzzes, I require a pot of good java.</p>
  <p><i class="fa-solid fa-coffee fa-2xl"></i> When my six o’clock alarm buzzes, I require a pot of good java.</p>

Literal Sizing

리터럴한 사이즈 변경 값입니다.

fa-1x - 1em
fa-2x - 2em
fa-3x - 3em
fa-4x - 4em
fa-5x - 5em
fa-6x - 6em
fa-7x - 7em
fa-8x - 8em
fa-9x - 9em
fa-10x - 10em

ex)

  <i class="fa-solid fa-camera fa-1x"></i>
  <i class="fa-solid fa-camera fa-2x"></i>
  <i class="fa-solid fa-camera fa-3x"></i>
  <i class="fa-solid fa-camera fa-4x"></i>
  <i class="fa-solid fa-camera fa-5x"></i>
  <i class="fa-solid fa-camera fa-6x"></i>
  <i class="fa-solid fa-camera fa-7x"></i>
  <i class="fa-solid fa-camera fa-8x"></i>
  <i class="fa-solid fa-camera fa-9x"></i>
  <i class="fa-solid fa-camera fa-10x"></i>