Form
Generic form controls.
Basic
Input
The .form-input
class is mean to be used on <input>
HTML element
State
Sizing
Your can create a small size of control by adding .form-input--sm
or .form-input--lg
modifier class on .form-input
container.
Select
The .form-select
class is mean to be used on <select></select>
HTML element
State
Sizing
Your can create a small size of control by adding .form-select--sm
or .form-select--lg
modifier class on .form-select
container.
Textarea
The .form-textarea
class is mean to be used on <textarea></textarea>
HTML element
State
Sizing
Your can create a small size of control by adding .form-textarea--sm
or .form-textarea--lg
modifier class on .form-textarea
container.
Range
The .form-range
class is mean to be used on <input type="range">
HTML element
Radio
The .form-radio
class is mean to be used on <input type="radio">
HTML element
Checkbox
The .form-checkbox
class is mean to be used on <input type="checkbox">
HTML element
Layout
Field
Add structure to basic styled form controls
Group
Group form controls on a single line
Inline
Use flex utility classes to display a series of group elements on a single row
Horizontal
Use Grid classes to create horizontal forms