Skip to main content

Forms

Showcase of various form control styles.

<form>
  <div class="row g-2">
    <div class="col-auto">
      <input 
        type="text" 
        class="form-control border-white fst-italic" 
        aria-label="First name" 
        placeholder="First name"
      >
    </div>
    <div class="col-auto">
      <input 
        type="email" 
        class="form-control border-white fst-italic" 
        aria-label="Email address" 
        placeholder="Email address"
      >
    </div>
    <div class="col-auto">
      <button type="submit" class="btn btn-primary">Sign Up</button>
    </div>
  </div>
</form>

Sizing

Adjust heights with classes like .form-control-lg and .form-control-sm.

<input class="form-control form-control-lg border-white" type="text" placeholder=".form-control-lg">
<input class="form-control border-white" type="text" placeholder="Default input">
<input class="form-control form-control-sm border-white" type="text" placeholder=".form-control-sm">

Forms in Bootstrap docs