Form
Basic form
Switch
The order of switch__indicator and switch__link can be swapped to show it inverted.
Checkbox
Radio
Group
http://
http://
Group multiple
http://
@example.com
http://
@example.com
Group with icons
Upload
Dropdown
<div class="dropdown dropdown--top-right">
<select name="language">
<option value="http://br.local.freepik.com/">Brazileiro</option>
<option value="http://de.local.freepik.com/">Deutsch</option>
<option value="http://local.freepik.com/" selected="">English</option>
<option value="http://local.freepik.es/">Español</option>
<option value="http://fr.local.freepik.com/">Français</option>
<option value="http://jp.local.freepik.com/">日本語</option>
<option value="http://pl.local.freepik.com/">Polski</option>
<option value="http://ru.local.freepik.com/">Pусский</option>
<option value="http://nl.local.freepik.com/">Nederlands</option>
<option value="http://it.local.freepik.com/">Italiano</option>
</select>
</div>
Range
new InputRange({
selector: '#range-fixed',
})
You can initialize the component dynamically
new InputRange({
selector: '#range-dynamic',
withSteps: true,
marks: [
{ value: 1, text: '1 people' },
{ value: 2, text: '2 people' },
{ value: 3, text: '3 people' },
]
})