Form Validation

Client-side validation styles and feedback

Bootstrap provides validation styles that replace default browser UI. Select a concept below to see it in action.

Toggle field state:

.form-control.is-valid
user@example.com

Looks good!

bootstrap_dev

Username is available.

<input class="form-control
is-valid" />
<div class="valid-feedback">
Feedback text</div>

Add .is-valid to an input and use .valid-feedback for a green success message below the field.