Components
Chip
상태·속성을 짧게 표시하는 정보성 컴포넌트입니다.
Enterprise File Transfer Active 운영 중
코드 보기
<span class="tn-chip">Enterprise File Transfer</span>Variants
| 이름 | 설명 | 미리보기 |
|---|---|---|
| Default | 테두리형 회색 텍스트 | Label |
| Solid | 검정 반전 — 활성/선택 상태 | Active |
| Dot | 상태 점 + 텍스트 | 운영 중 |
Guidelines
✓ Do
- 헤더·카드 우상단의 상태 표시에 사용
- 텍스트는 3단어 이내
✕ Don't
- 클릭 행동을 넣지 않는다 (행동은 Button)
- 한 줄에 4개 이상 나열하지 않는다
Specification
| 속성 | 토큰/값 | 비고 |
|---|---|---|
radius | var(--radius-pill) = 999px | |
타이포 | 0.68rem / 600 | |
패딩 | 2px 10px |
비교
Chip vs Button — Chip은 정보, Button은 행동.