Checkbox
체크박스(Checkbox)는 사용자가 여러 개의 옵션 중 한 개 이상의 값을 선택할 수 있도록 하는 경우에 사용합니다.
즉, 체크박스의 선택은 상호 독립적이므로 한 개의 옵션을 선택하는 것은 다른 옵션의 선택에 영향을 미치지 않습니다.
즉, 체크박스의 선택은 상호 독립적이므로 한 개의 옵션을 선택하는 것은 다른 옵션의 선택에 영향을 미치지 않습니다.
Type
Single
Group Title
Group
Anatomy
Accept terms and condition
You agree to our Terms of Service and Privacy Policy.
01
02
03
- Checkbox
- Label (선택)
- Description (선택)
State
상태는 Default / Check / Disable / Indeterminate 4가지로 사용합니다. Indeterminate는 하위 체크박스 요소가 Default와 Check 상태가 혼용되었을때 사용됩니다.
Check 상태일 때, Checkbox BG color는 해당 솔루션의 primary color를 사용합니다.
Check 상태일 때, Checkbox BG color는 해당 솔루션의 primary color를 사용합니다.
Default
Check
Disable
Indeterminate
Size
사이즈는 md / lg / xl 3가지를 사용합니다.
xl(24px)
lg(20px)
md(16px)
사용 가이드
사용 관련
Do
단일 선택 항목에는 Checkbox 대신 Radio를 사용합니다.
Don’t
Checkbox의 라벨에 두 줄 이상의 긴 문장을 넣지마세요. 라벨은 짧게 지정하고 설명글을 사용합니다.