Components
Icon Button
아이콘만으로 된 보조 버튼입니다. 반드시 title을 답니다.
코드 보기
<button class="tn-iconbtn" title="테마 전환">◐</button>Variants
| 이름 | 설명 | 미리보기 |
|---|---|---|
| 기본 | 테두리형 → hover 파랑 | |
| 원형 | 라운드 50% (테마 버튼) |
Guidelines
✓ Do
- title(툴팁) 필수 — 의미가 아이콘만으로 안 전달됨
- 주 행동엔 쓰지 않는다 (텍스트 버튼)
✕ Don't
- 아이콘 버튼을 3개 이상 나란히 두지 않는다
- 채운 배경 금지 (테두리형 유지)
Specification
| 속성 | 토큰/값 | 비고 |
|---|---|---|
크기 | 32px / 6px radius | |
hover | 파랑 테두리+muted |