<!-- date picker -->
<input type="text" class="form-control datepicker" data-format="yyyy-mm-dd" data-lang="en" data-RTL="false">

<!-- range picker -->
<input type="text" class="form-control rangepicker" value="2017-01-01 - 2017-12-31" data-format="yyyy-mm-dd" data-from="2017-01-01" data-to="2017-12-31">

<input type="text" class="form-control timepicker" value="11 : 55 : PM">

<!--
	COLOR PICKER OPTONS

	data-format="hex|hex3|hsl|rgb|name"
	data-fullpicker="true"
	data-palletteOnly="true"

	data-allowEmpty="true"

	// Translation Usage
	data-chooseText="Choose"
	data-cancelText="Cancel"
	
	data-flat="true"	- inline picker , always visible
-->


<!-- HEX -->
<div class="relative">
	<input type="text" class="form-control colorpicker" data-format="hex" data-defaultColor="#FF0000">
</div>


<!-- RGB -->
<div class="relative">
	<input type="text" class="form-control colorpicker" data-format="rgb" data-defaultColor="#333333">
</div>


<!-- Allow Empty -->
<div class="relative">
	<input type="text" class="form-control colorpicker" data-format="hex" data-allowEmpty="true" data-defaultColor="#eaeaea">
</div>


<!-- Full Picker -->
<div class="relative">
	<input type="text" class="form-control colorpicker" data-format="hex" data-fullpicker="true" data-defaultColor="#C69F00">
</div>


<!-- Pallete Only -->
<div class="relative">
	<input type="text" class="form-control colorpicker" data-format="hex" data-palletteOnly="true" data-defaultColor="#001FA0">
</div>

<!-- Input Picker -->
<div class="relative">
	<input type="color" class="form-control colorpicker" value="#3355cc">
</div>