Docs 레이아웃 메뉴바 메인구성 자동박스 신형 자동박스(v2) Color Picker 웹 접근성 본고딕 UI/UX SEO 폰트설정 Plugins 아이콘(NDfont) Slick Tabs Sticky 전국지도 Swiper Validate Codemirror Custom Scroll Foundation 버튼 체크박스/라디오 스위치 레이블 패널 알림
Defalut Radio1 Radio2 Radio3 Checkbox1 Checkbox2 Checkbox3 <!-- Radio --> <label> <input type="radio" name="radio1" checked> Radio1 </label> <label> <input type="radio" name="radio1"> Radio2 </label> <label> <input type="radio" name="radio1"> Radio3 </label> <!-- checkbox --> <label> <input type="checkbox" name="checkbox1" checked> Checkbox1 </label> <label> <input type="checkbox" name="checkbox1"> Checkbox2 </label> <label> <input type="checkbox" name="checkbox1"> Checkbox3 </label> Custom Radio1 Radio2 Radio3 Checkbox1 Checkbox2 Checkbox3 <!-- Radio --> <label class="nd-radio"> <input type="radio" name="radio2" checked> <span class="nd-checked">Radio1</span> </label> <label class="nd-radio"> <input type="radio" name="radio2"> <span class="nd-checked">Radio2</span> </label> <label class="nd-radio"> <input type="radio" name="radio2"> <span class="nd-checked">Radio3</span> </label> <!-- Checkbox --> <label class="nd-checkbox"> <input type="checkbox" name="checkbox2" checked> <span class="nd-checked">Checkbox1</span> </label> <label class="nd-checkbox"> <input type="checkbox" name="checkbox2"> <span class="nd-checked">Checkbox2</span> </label> <label class="nd-checkbox"> <input type="checkbox" name="checkbox2"> <span class="nd-checked">Checkbox3</span> </label> Custom Group Radio1 Radio2 Radio3 Checkbox1 Checkbox2 Checkbox3 <!-- Radio --> <div class="nd-group"> <label class="nd-radio"> <input type="radio" name="radio3" checked> <span class="nd-checked">Radio1</span> </label> <label class="nd-radio"> <input type="radio" name="radio3"> <span class="nd-checked">Radio2</span> </label> <label class="nd-radio"> <input type="radio" name="radio3"> <span class="nd-checked">Radio3</span> </label> </div> <!-- Checkbox --> <div class="nd-group"> <label class="nd-checkbox"> <input type="checkbox" name="checkbox3" checked> <span class="nd-checked">Checkbox1</span> </label> <label class="nd-checkbox"> <input type="checkbox" name="checkbox3"> <span class="nd-checked">Checkbox2</span> </label> <label class="nd-checkbox"> <input type="checkbox" name="checkbox3"> <span class="nd-checked">Checkbox3</span> </label> </div> Colors Primary Radio Primary Radio Success Radio Warning Radio Dark Radio Pink Radio Primary Checkbox Primary Checkbox Success Checkbox Warning Checkbox Dark Checkbox Pink Checkbox <!-- Radio --> <label class="nd-radio"> <input type="radio" checked> <span class="nd-checked">Primary Radio</span> </label> <label class="nd-radio radio-primary"> <input type="radio" checked> <span class="nd-checked">Primary Radio</span> </label> <label class="nd-radio radio-success"> <input type="radio" checked> <span class="nd-checked">Success Radio</span> </label> <label class="nd-radio radio-warning"> <input type="radio" checked> <span class="nd-checked">Warning Radio</span> </label> <label class="nd-radio radio-dark"> <input type="radio" checked> <span class="nd-checked">Dark Radio</span> </label> <label class="nd-radio radio-pink"> <input type="radio" checked> <span class="nd-checked">Pink Radio</span> </label> <!-- Checkbox --> <label class="nd-checkbox"> <input type="checkbox" checked> <span class="nd-checked">Primary Checkbox</span> </label> <label class="nd-checkbox check-primary"> <input type="checkbox" checked> <span class="nd-checked">Primary Checkbox</span> </label> <label class="nd-checkbox check-success"> <input type="checkbox" checked> <span class="nd-checked">Success Checkbox</span> </label> <label class="nd-checkbox check-warning"> <input type="checkbox" checked> <span class="nd-checked">Warning Checkbox</span> </label> <label class="nd-checkbox check-dark"> <input type="checkbox" checked> <span class="nd-checked">Dark Checkbox</span> </label> <label class="nd-checkbox check-pink"> <input type="checkbox" checked> <span class="nd-checked">Pink Checkbox</span> </label> Button Radio1 Radio2 Radio3 Checkbox1 Checkbox2 Checkbox3 <!-- Radio --> <div class="radio-group"> <input type="radio" name="radio4" id="radio41" checked> <label for="radio41">Radio1</label> <input type="radio" name="radio4" id="radio42"> <label for="radio42">Radio2</label> <input type="radio" name="radio4" id="radio43"> <label for="radio43">Radio3</label> </div> <!-- Checkbox --> <div class="checkbox-group"> <input type="checkbox" name="checkbox4" id="checkbox41" checked> <label for="checkbox41">Checkbox1</label> <input type="checkbox" name="checkbox4" id="checkbox42"> <label for="checkbox42">Checkbox2</label> <input type="checkbox" name="checkbox4" id="checkbox43"> <label for="checkbox43">Checkbox3</label> </div>
Defalut Radio1 Radio2 Radio3 Checkbox1 Checkbox2 Checkbox3 <!-- Radio --> <label> <input type="radio" name="radio1" checked> Radio1 </label> <label> <input type="radio" name="radio1"> Radio2 </label> <label> <input type="radio" name="radio1"> Radio3 </label> <!-- checkbox --> <label> <input type="checkbox" name="checkbox1" checked> Checkbox1 </label> <label> <input type="checkbox" name="checkbox1"> Checkbox2 </label> <label> <input type="checkbox" name="checkbox1"> Checkbox3 </label>
Custom Radio1 Radio2 Radio3 Checkbox1 Checkbox2 Checkbox3 <!-- Radio --> <label class="nd-radio"> <input type="radio" name="radio2" checked> <span class="nd-checked">Radio1</span> </label> <label class="nd-radio"> <input type="radio" name="radio2"> <span class="nd-checked">Radio2</span> </label> <label class="nd-radio"> <input type="radio" name="radio2"> <span class="nd-checked">Radio3</span> </label> <!-- Checkbox --> <label class="nd-checkbox"> <input type="checkbox" name="checkbox2" checked> <span class="nd-checked">Checkbox1</span> </label> <label class="nd-checkbox"> <input type="checkbox" name="checkbox2"> <span class="nd-checked">Checkbox2</span> </label> <label class="nd-checkbox"> <input type="checkbox" name="checkbox2"> <span class="nd-checked">Checkbox3</span> </label>
Custom Group Radio1 Radio2 Radio3 Checkbox1 Checkbox2 Checkbox3 <!-- Radio --> <div class="nd-group"> <label class="nd-radio"> <input type="radio" name="radio3" checked> <span class="nd-checked">Radio1</span> </label> <label class="nd-radio"> <input type="radio" name="radio3"> <span class="nd-checked">Radio2</span> </label> <label class="nd-radio"> <input type="radio" name="radio3"> <span class="nd-checked">Radio3</span> </label> </div> <!-- Checkbox --> <div class="nd-group"> <label class="nd-checkbox"> <input type="checkbox" name="checkbox3" checked> <span class="nd-checked">Checkbox1</span> </label> <label class="nd-checkbox"> <input type="checkbox" name="checkbox3"> <span class="nd-checked">Checkbox2</span> </label> <label class="nd-checkbox"> <input type="checkbox" name="checkbox3"> <span class="nd-checked">Checkbox3</span> </label> </div>
Colors Primary Radio Primary Radio Success Radio Warning Radio Dark Radio Pink Radio Primary Checkbox Primary Checkbox Success Checkbox Warning Checkbox Dark Checkbox Pink Checkbox <!-- Radio --> <label class="nd-radio"> <input type="radio" checked> <span class="nd-checked">Primary Radio</span> </label> <label class="nd-radio radio-primary"> <input type="radio" checked> <span class="nd-checked">Primary Radio</span> </label> <label class="nd-radio radio-success"> <input type="radio" checked> <span class="nd-checked">Success Radio</span> </label> <label class="nd-radio radio-warning"> <input type="radio" checked> <span class="nd-checked">Warning Radio</span> </label> <label class="nd-radio radio-dark"> <input type="radio" checked> <span class="nd-checked">Dark Radio</span> </label> <label class="nd-radio radio-pink"> <input type="radio" checked> <span class="nd-checked">Pink Radio</span> </label> <!-- Checkbox --> <label class="nd-checkbox"> <input type="checkbox" checked> <span class="nd-checked">Primary Checkbox</span> </label> <label class="nd-checkbox check-primary"> <input type="checkbox" checked> <span class="nd-checked">Primary Checkbox</span> </label> <label class="nd-checkbox check-success"> <input type="checkbox" checked> <span class="nd-checked">Success Checkbox</span> </label> <label class="nd-checkbox check-warning"> <input type="checkbox" checked> <span class="nd-checked">Warning Checkbox</span> </label> <label class="nd-checkbox check-dark"> <input type="checkbox" checked> <span class="nd-checked">Dark Checkbox</span> </label> <label class="nd-checkbox check-pink"> <input type="checkbox" checked> <span class="nd-checked">Pink Checkbox</span> </label>
Button Radio1 Radio2 Radio3 Checkbox1 Checkbox2 Checkbox3 <!-- Radio --> <div class="radio-group"> <input type="radio" name="radio4" id="radio41" checked> <label for="radio41">Radio1</label> <input type="radio" name="radio4" id="radio42"> <label for="radio42">Radio2</label> <input type="radio" name="radio4" id="radio43"> <label for="radio43">Radio3</label> </div> <!-- Checkbox --> <div class="checkbox-group"> <input type="checkbox" name="checkbox4" id="checkbox41" checked> <label for="checkbox41">Checkbox1</label> <input type="checkbox" name="checkbox4" id="checkbox42"> <label for="checkbox42">Checkbox2</label> <input type="checkbox" name="checkbox4" id="checkbox43"> <label for="checkbox43">Checkbox3</label> </div>
