뱃지
Betelgeuse 의 뱃지는 네오브루탈 상태를 두꺼운 테두리와 강한 색면으로 표시한다. 작은 요소도 포스터처럼 읽히게 만드는 것이 목적이다.
상태
neutral
neutralinfo
infosuccess
successwarning
warningdanger
danger활용 방법
상태 표시
강한 색면으로 상태를 즉시 구분한다.
Preview
LiveHotStop
tsx
<Badge tone="success">Live</Badge>
스타일 원칙
- · 라벨은 짧고 강하게 쓴다.
- · 색면과 하드 섀도를 작게라도 유지한다.
속성
| 이름 | 타입 | 기본값 | 설명 |
|---|---|---|---|
| tone | "neutral" | "info" | "success" | "warning" | "danger" | "neutral" | 의미 색 |
| children | ReactNode | - | 라벨 |