• welcome
  • faqs
  • principle
  • semantic
  • tokens
  • components
  • theming
  • typography
  • colors
  • badge
  • button
  • calendar
  • cards
  • checkbox
  • input
  • list
  • message
  • pagination
  • panel
  • segments
  • selectbox
  • switch
  • table
  • tabs
  • tag
  • form
  • grid
  • grid2
  • modal
  • toast

    • Checkbox

    접근성이 보장된 명확한 시각 상태를 가진 멀티 선택 입력.

    기본

    
<!-- checkbox -->
<label class="ga-checkbox {checked}">
    <input type="checkbox" /> Label Text
</label>
<!-- radio -->
<label class="ga-checkbox radio {checked}">
    <input type="radio" /> Label Text
</label>

    No label

    
<!-- no label -->
<label class="ga-checkbox {checked}">
    <input type="checkbox" />
</label>
<!-- use label -->
<label class="ga-checkbox {checked}">
    <input type="checkbox" /> Use label
</label>

    Checkbox

    
<label class="ga-checkbox {checked}">
    <input type="checkbox" /> Label Text
</label>
<!-- radio -->
<label class="ga-checkbox radio {checked}">
    <input type="radio" /> Label Text
</label>

    Indeterminate

    
<label class="ga-checkbox indeter {checked}">
    <input type="radio" /> Label Text
</label>

    Radio

    
<label class="ga-checkbox radio {checked}">
    <input type="radio" name="radio" /> Label Text
</label>