Components

Select Box

목록에서 하나를 고르는 드롭다운입니다.

코드 보기
<select class="tn-select">
  <option>Qwen3.5-9B SFT (기본)</option>
</select>

Variants

이름설명미리보기
기본tn-input 규격 + 화살표
disabledopacity .5

Guidelines

✓ Do
  • 기본값을 첫 항목에 두고 "(기본)" 표기
  • 항목 7개 초과 시 검색형 고려
✕ Don't
  • 2~3개 선택지엔 쓰지 않는다 (Segmented/Radio)
  • 다중 선택 select 금지 (체크박스 목록 사용)

Specification

속성토큰/값비고
radius7px
focusvar(--primary)
화살표인라인 svg

비교

Select vs Segmented — 4개 이상이거나 목록이 길면 Select, 2~3개 고정이면 Segmented.