Counter Label Usage
알림, 항목의 개수, 상태를 나타냅니다.
Layout
Sizing
Counter label은 일반적으로 맥락을 제공해주는 텍스트와 함께 사용되거나 select / input 컴포넌트 내부에서 사용됩니다. 함께 사용되는 맥락 텍스트 크기나 맥락 컴포넌트의 크기를 바탕으로 크기를 알맞게 적용하여 사용합니다.
1. 텍스트에 함께 붙어 사용되는 경우
| Text Size | Counter Label Size |
|---|---|
| 14+ | Medium |
| Up to 12 | Small |
2. Select / Input 컴포넌트 내부에서 사용하는 경우
| Context Component Size | Counter Label Size |
|---|---|
| Medium | Medium |
| Small | Small |
Behaviors
Interactions
Counter badge에 커서를 올리면 숨겨진 정보가 tooltip을 통해 보여질 수 있습니다.
