Components · Feedback

Tooltip

hover/focus 시 노출되는 짧은 설명. 모바일에서는 작동 안 함 — *핵심* 정보는 본문에 두세요.

Preview

짧은 설명 추가 컨텍스트

Usage

<span class="tooltip">
  <button class="btn btn-ghost">호버하세요</button>
  <span class="tt-content">짧은 설명</span>
</span>

Rules

DO

  • 아이콘-only 버튼의 라벨 보조에 사용.
  • 텍스트 1~2줄 이내.

DON'T

  • 모바일에서 핵심 정보 전달 금지 (hover 안 됨).
  • 긴 본문 금지 — Sheet 또는 Modal 사용.