DSDesignSkill
|

도움말/기준

아이콘 표준

모든 아이콘은 Tabler Icons(MIT) 정품 path를 인라인으로만 씁니다.

자산에 들어가는 아이콘은 외부 스크립트나 아이콘 폰트를 쓰지 않고, SVG path를 HTML에 직접 박아 넣습니다. 받는 사람이 추가 설치 없이 파일 하나로 끝낼 수 있어야 하기 때문입니다.

규격

<svg class="w-[18px] h-[18px] shrink-0" viewBox="0 0 24 24" fill="none"
     stroke="currentColor" stroke-width="1.8"
     stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
  <path d="..." />
</svg>

Tailwind에 없는 크기 클래스를 쓰지 않습니다

w-4.5, h-5.5, w-6.5 같은 값은 Tailwind 기본 스케일에 없습니다. 써 두면 CSS 규칙이 아예 만들어지지 않아 SVG가 크기를 못 받고 세로로 늘어납니다. 소수점 중 실제로 존재하는 것은 0.5 1.5 2.5 3.5뿐이고, 그 외 크기가 필요하면 w-[18px]처럼 임의값을 씁니다.

이 규칙은 사람이 지키는 게 아니라 검사 스크립트가 배치마다 자동으로 걸러냅니다.