Below is a list of basic inputs to be used within forms or as stand alone elements. They can be disabled by adding the 'disabled' attribute.

Text inputs

emmet:
input.form-control[type="text" placeholder="Text input"]
emmet:
textarea.form-control[type="text" rows="3" placeholder="Text area input"]
emmet:
input.form-control[type="password" placeholder="Text input"]

Numbers

emmet:
input.form-control[type="number"]

Datepicker

emmet:
input.form-control[type="date"]

Color picker

emmet:
input.form-control[type="color"]

File control

emmet:
input.form-control[type="file"]

Checkboxes and radiobuttons

Inline checkboxes

emmet:
.checkbox>label>input[type="checkbox" value=""]+{Check 1}
emmet in soc-form:
input[type="checkbox" value=""]
emmet disabled:
.checkbox.disabled>label>input[type="checkbox" disabled value=""]+{Check 1}
emmet inline:
.checkbox-inline>label>input[type="checkbox" value=""]+{Check 1}
Warning A checkbox should be created different when used inside a soc-form. check the examples and emmet below.

Inline checkboxes

emmet:
.radio>label>input[type="radio" name="radios" id="radio1" value="opt1"]+{Radiobutton 1}
emmet disabled:
.radio.disabled>label>input[type="radio" disabled name="radios" id="radio1" value="opt1"]+{Radiobutton 1}
emmet inline:
.radio-inline>label>input[type="radio" name="radios" id="radio1" value="opt1"]+{Radiobutton 1}

Dropdowns / selects

Multiselect
emmet:
select.form-control>option{option $}*10
emmet multiple:
select.form-control[multiple]>option{option $}*10

Static text

Sometimes helper text is required in a form, the static control can be used for just that. It only makes sense with a label next to it however.

email@example.com

emmet:
p.form-control-static{This is static}