Material form inputs

Examples of material design form controls. All textual <input>, <textarea>, and <select> elements support this option, which includes floating labels. Supports 2 styles and 2 label placements. To use, add .form-group-floating to .form-group container and one of the styling option classes: .form-control-outline, .form-control-outline-within and .form-control-filled. It's all done with CSS only, no JS required.

Outline style. Label outside
Outline style. Label inside
Filled style