form-input
Default Input
To use add Input
in the form group
Input With Helper Text
To use add Formtext
in the form group
Password
To use add type="password"
in the form group
Disabled Input
Add attribute disabled
to disable input field.
Predefined Input Value
Add attribute defaultValue="VALUE"
.
Readonly Input Field
Add attribute readonly
to set field.
Input With Placeholder
Add attribute placeholder="..."
to input area
Maximum Value
Add attribute maxLength="6"
to input area
Minimum Value
Add attribute minLength="5"
to input area
Input Type Options
Input Type Text
Using input type="text"
Input Type Password
Using input type="password"
Input Phone Number
Using input type="tel"
Input Type Email
Using input type="email"
Input Type URL
Using input type="url"
Input Type Search
Using input type="url"
Input Type Numbers
Using input type="number"
Input Type Date Time
Using input type="datetime-local"
Input Type Date
Using input type="date"
Input Type Time
Using input type="time"
Input Type Week
Using input type="week"
Input Type Month
Using input type="month"
Input Type Color
Using input type="color"
Input Type Range
Using input type="range"
General Textarea
Textarea
Textarea With Placeholder
Textarea With Helper Text
Inline Checkboxes & Radios
Inline Default Checkbox
Inline Default Radio Button
Inline Custom Checkbox
Inline Custom Radio Button
General Select
Select
Form Select
To use add .form-select
class
Multiple Select
Select With Addons
Select With Buttons
File Upload
Default File Upload
To use add type="file"
to the input
Custom File Upload
To use add .custom-file-input
class to the input
Custom File Upload with Button Left
Custom File Upload with Button Right
Different Style in Helper Text
Left Helper Text
To use add float-left
class to the text
Center Helper Text
To use add text-center
class to the text
Right Helper Text
To use add float-right
class to the text