KTUIKTUI
KTUIKTUI
ComponentsDocsStore

Getting Started

IntroductionInstallationApproachThemingJavaScriptDark modeRTLReferencesChangelog

Components

AccordionAvatarAlertBadgeBreadcrumbButtonCardCheckboxCollapseDatatableDatepickerSoonDismissDrawerDropdownImage InputInputKbdLinkModalPaginationProgressRadio GroupReparentScrollableScrollspyScrolltoSelectSoonSeparatorSkeletonStepperStickySwitchTabsTextareaTheme SwitchToggleToggle GroupToggle PasswordTooltip
©2025 KtUI. All rights reserved.
A project by Keenthemes
Docs
Toggle Group

Toggle Group

A set of two-state buttons that can be toggled on or off.

Examples

Basic Usage

<div class="kt-toggle-group">
  <label class="kt-btn"
    >Week<input type="radio" name="date-range" value="week" /></label
  ><label class="kt-btn"
    >Today<input
      type="radio"
      name="date-range"
      checked=""
      value="today" /></label
  ><label class="kt-btn"
    >Month<input type="radio" name="date-range" value="month" /></label
  ><label class="kt-btn"
    >All<input type="radio" name="date-range" value="all"
  /></label>
</div>

Multiple

<div class="kt-toggle-group">
  <label class="kt-btn"
    >Week<input
      type="checkbox"
      name="date-range"
      checked=""
      value="week" /></label
  ><label class="kt-btn"
    >Today<input
      type="checkbox"
      name="date-range"
      checked=""
      value="today" /></label
  ><label class="kt-btn"
    >Month<input type="checkbox" name="date-range" value="month" /></label
  ><label class="kt-btn"
    >All<input type="checkbox" name="date-range" value="all"
  /></label>
</div>
PreviouseToggleNextToggle Password

On This Page

  • Examples
    • Basic Usage
    • Multiple