kitstrapのフォーム部品は、クラスを付与するだけで簡単に使用することができます。

class kit-textbox

　input要素やtextarea要素に.kit-textboxクラスを使ってスタイルを付与できます。子クラスの.darkを使うと暗いテーマを適用できます。
　また、.-small、.-medium、.-largeの3つの子クラスやkit-width接頭辞を持つクラスを使用することでテキストボックスの幅を制御することができます。

　また、.kit-textboxに対してdisabled属性を付与すると、入力不能フィールドとなり、専用のスタイルが適用されます。

<input type="text" class="textbox" placeholder="入力不能フィールド" disabled>

　.-flat子クラスを使用すると、フラットなスタイルのテキストボックスに変更することができます。.-darkとの併用も可能です。

　子クラス.-roundedを用いて、丸みを帯びたデザインに変更することが可能です。

class label.kit-toggle

　クラス.kit-togleを付与したlabel要素内にtype="checkbox"を持つinput要素、説明のテキスト、for属性を持つ空のラベル要素を順に配置することで、チェックボックスをトグル項目として表示することができます。

<label class="kit-toggle">
    <input type="checkbox" id="matsu">松<label for="matsu"></label>
</label>
<label class="kit-toggle">
    <input type="checkbox" id="take">竹<label for="take"></label>
</label>
<label class="kit-toggle">
    <input type="checkbox" id="ume">梅<label for="ume"></label>
</label>

class tag kit-formgroup

　class="kit-formgroup"または<kit-formgroup></kit-formgroup>要素の中に上記のkit-button(kit-button-alt、kit-btnも含む)や.textbox要素を内包すると、フォーム部品を連結することができます。

<kit-formgroup class="p">
    <kit-button-alt>ボタン1</kit-button-alt>
    <kit-button-alt>ボタン2</kit-button-alt>
    <kit-button-alt>ボタン3</kit-button-alt>
    <kit-button-alt>ボタン4</kit-button-alt>
</kit-formgroup>
<kit-formgroup class="p">
    <kit-btn>ボタン1</kit-btn>
    <kit-btn>ボタン2</kit-btn>
    <kit-btn>ボタン3</kit-btn>
    <kit-btn>ボタン4</kit-btn>
</kit-formgroup>
<kit-formgroup class="p">
    <kit-button class="crimson">ボタン1</kit-button>
    <kit-button class="limegreen">ボタン2</kit-button>
    <kit-button class="orange">ボタン3</kit-button>
    <kit-button class="deeppink">ボタン4</kit-button>
</kit-formgroup>
<kit-formgroup class="p kit-flex kit-flex-nowrap kit-fit">
    <input type="text" class="textbox kit-width-75">
    <kit-button-alt class="kit-text-c kit-width-25">Search</kit-button-alt>
</kit-formgroup>