Please wait...

search
close

## BASIC FORM ELEMENTS

## INPUT Different sizes and widths

- more_vert

## Basic Examples

## Different Widths

## Different Sizes

## Floating Label Examples

Username
Password
Large Input
Default Input
Small Input

## Input Status

## TEXTAREA

- more_vert

## Basic Example

## Auto Growing Vertical Direction Taken from github.com/jackmoore/autosize/tree/master

## SELECT Taken from silviomoreto.github.io/bootstrap-select

- more_vert

## BOOTSTRAP DATE PICKER Taken from github.com/uxsolutions/bootstrap-datepicker

- more_vert

## Text Input

## Component

date_range

## Range

to

## DATETIME PICKER Taken from github.com/T00rk/bootstrap-material-datetimepicker with momentjs.com

- more_vert

## CHECKBOX Taken from materializecss.com

- more_vert

## Basic Examples

Default Filled In Default - Disabled Filled In - Disabled

## With Material Design Colors

RED PINK PURPLE DEEP PURPLE INDIGO BLUE LIGHT BLUE CYAN TEAL GREEN LIGHT GREEN LIME YELLOW AMBER ORANGE DEEP ORANGE BROWN GREY BLUE GREY BLACK

## With Material Design Colors - Filled In

RED PINK PURPLE DEEP PURPLE INDIGO BLUE LIGHT BLUE CYAN TEAL GREEN LIGHT GREEN LIME YELLOW AMBER ORANGE DEEP ORANGE BROWN GREY BLUE GREY BLACK

## RADIO Taken from materializecss.com

- more_vert

## Basic Examples

Radio - 1 Radio - 2 Radio - With Gap Radio - With Gap Radio - Disabled Radio - Disabled

## With Material Design Colors You can use material design colors which examples are `.radio-col-pink, .radio-col-cyan` class

RED PINK PURPLE DEEP PURPLE INDIGO BLUE LIGHT BLUE CYAN TEAL GREEN LIGHT GREEN LIME YELLOW AMBER ORANGE DEEP ORANGE BROWN GREY BLUE GREY BLACK

## With Material Design Colors - With Gap Add to `.with-gap` class

RED PINK PURPLE DEEP PURPLE INDIGO BLUE LIGHT BLUE CYAN TEAL GREEN LIGHT GREEN LIME YELLOW AMBER ORANGE DEEP ORANGE BROWN GREY BLUE GREY BLACK

## SWITCH BUTTON Taken from materializecss.com

- more_vert

## Basic Examples

OFFON
DISABLED

## With Material Design Colors You can use material design colors which examples are `.switch-col-pink, .switch-col-teal` class

RED
PINK
PURPLE
DEEP PURPLE
INDIGO
BLUE
LIGHT BLUE
CYAN
TEAL
GREEN
LIGHT GREEN
LIME
YELLOW
AMBER
ORANGE
DEEP ORANGE
BROWN
GREY
BLUE GREY
BLACK