Form Elements
Form Input & Textarea
A basic form control input and textarea with disabled and readonly mode.
Valid State Input
A form control with success, warning and error state.
Default Form Input Fields with labels
A form control with labels state.
Input Sizes
A form control sizes in large,small Fields.
Toggle Switches
A custom made toggles with jquery support.
Form Elements like Switch, Colors, Checkboxes & Radio Buttons
Below are the different kinds of form elements.
Toggle switch single
Toggle switch single Checked
Your skills
Select Color
File Input Sizes
File inputs are in small, default, large Fields.
File Input Examples
Below are the File Inputs with Mutltiple Files and Disabled File.
Input Groups
Easily extend form controls by adding text, buttons, or button groups on either side of textual inputs.
Input Mask
Input masks allows a user to more easily enter fixed width input where you would like them to enter the data in a certain format (dates,phones, etc).
Color Picker 1
Below is the Color Picker for choosing Colors for a theme.
Same way you select color in Adobe Photoshop.
You can allow alpha transparency selection. Check out these example.
Show pallete only. If you'd like, spectrum can show the palettes you specify.
Color Picker 2
Below is the Color Picker for choosing Colors for a theme.
Date and time Picker
The date and time picker is tied to a standard form input field. Click on the input to open an interactive calendar in a small overlay. If a date is chosen, feedback is shown as the input's value.Set the numberOfMonths option to an integer of 2 or more to show multiple months in a single datepicker.
JQuery UI Date Picker
The datepicker is tied to a standard form input field. Click on the input to open an interactive calendar in a small overlay. If a date is chosen, feedback is shown as the input's value.Set the numberOfMonths option to an integer of 2 or more to show multiple months in a single datepicker.
Date, Month, Year Range Picker
Display the datepicker embedded in the page instead of in an overlay.
Range Slider
Easy, flexible and responsive range slider with skin support.