Radio Group

<div class="grid gap-2.5">
  <div class="flex items-center gap-2.5">
    <input
      type="radio"
      class="kt-radio"
      id="radio_1"
      name="level"
      value="1"
    /><label class="kt-label" for="radio_1">Beginner</label>
  </div>
  <div class="flex items-center gap-2.5">
    <input
      type="radio"
      class="kt-radio"
      id="radio_2"
      name="level"
      checked=""
      value="2"
    /><label class="kt-label" for="radio_2">Intermediate</label>
  </div>
  <div class="flex items-center gap-2.5">
    <input
      type="radio"
      class="kt-radio"
      id="radio_3"
      name="level"
      value="3"
    /><label class="kt-label" for="radio_3">Beginner</label>
  </div>
</div>

<div class="grid gap-2.5">
  <div class="flex items-center gap-2.5">
    <input
      type="radio"
      class="kt-radio"
      id="radio_1"
      name="level"
      value="1"
    /><label class="kt-label" for="radio_1">Beginner</label>
  </div>
  <div class="flex items-center gap-2.5">
    <input
      type="radio"
      class="kt-radio"
      id="radio_2"
      name="level"
      checked=""
      value="2"
    /><label class="kt-label" for="radio_2">Intermediate</label>
  </div>
  <div class="flex items-center gap-2.5">
    <input
      type="radio"
      class="kt-radio"
      disabled=""
      id="radio_3"
      name="level"
      value="3"
    /><label class="kt-label" for="radio_3">Beginner</label>
  </div>
</div>

<div class="grid gap-2.5">
  <div class="flex items-center gap-2.5">
    <input
      type="radio"
      class="kt-radio kt-radio-mono"
      id="radio_1"
      name="level"
      value="1"
    /><label class="kt-label" for="radio_1">Beginner</label>
  </div>
  <div class="flex items-center gap-2.5">
    <input
      type="radio"
      class="kt-radio kt-radio-mono"
      id="radio_2"
      name="level"
      checked=""
      value="2"
    /><label class="kt-label" for="radio_2">Intermediate</label>
  </div>
  <div class="flex items-center gap-2.5">
    <input
      type="radio"
      class="kt-radio kt-radio-mono"
      id="radio_3"
      name="level"
      value="3"
    /><label class="kt-label" for="radio_3">Beginner</label>
  </div>
</div>

<div class="grid gap-2.5">
  <div class="flex items-center gap-2.5">
    <input
      type="radio"
      class="kt-radio kt-radio-sm"
      id="radio_1"
      name="level"
      value="1"
    /><label class="kt-label" for="radio_1">Small</label>
  </div>
  <div class="flex items-center gap-2.5">
    <input
      type="radio"
      class="kt-radio"
      id="radio_2"
      name="level"
      checked=""
      value="2"
    /><label class="kt-label" for="radio_2">Default</label>
  </div>
  <div class="flex items-center gap-2.5">
    <input
      type="radio"
      class="kt-radio kt-radio-lg"
      id="radio_3"
      name="level"
      value="3"
    /><label class="kt-label" for="radio_3">Large</label>
  </div>
</div>

<form class="kt-form">
  <div class="kt-form-item">
    <div class="kt-form-control mb-1">
      <div class="grid gap-2.5">
        <div class="flex items-center gap-2.5">
          <input
            type="radio"
            class="kt-radio"
            id="radio_1"
            name="level"
            value="1"
          /><label class="kt-label" for="radio_1">Beginner</label>
        </div>
        <div class="flex items-center gap-2.5">
          <input
            type="radio"
            class="kt-radio"
            id="radio_2"
            name="level"
            checked=""
            value="2"
          /><label class="kt-label" for="radio_2">Intermediate</label>
        </div>
        <div class="flex items-center gap-2.5">
          <input
            type="radio"
            class="kt-radio"
            id="radio_3"
            name="level"
            value="3"
          /><label class="kt-label" for="radio_3">Beginner</label>
        </div>
      </div>
    </div>
    <div class="kt-form-description">Please select your level</div>
    <div class="kt-form-message">You need to select your level</div>
  </div>
  <div class="kt-form-actions justify-start">
    <button type="reset" class="kt-btn kt-btn-outline">Reset</button
    ><button type="submit" class="kt-btn">Submit</button>
  </div>
</form>