<div class="row">
  <div class="col-lg-... d-flex align-items-stretch">
    <div class="card w-100">
      <div class="card-body">

      </div>
    </div>
  </div>
</div>

Lze použít .col-lg-(1 až 12) .col-md-(1 až 12) .col-sm-(1 až 12) .col-(1 až 12) d-flex align-items-stretch automaticky dorovnává výšku dlaždic.
w-100 nastavuje šířku dlaždice na 100% je to důležíté kvůli flexboxu

<div class="form-group {modifikator}">
  <label for="moleculeId" id="labelId" aria-label="" aria-labelledby="" class="form-control-label ">Label <span class="required"> </span> </label>
  <input type="text" aria-labelledby="" aria-required="true" id="" name="input" tabindex="" placeholder="Patternlab Input" class="form-control " value="">
  <p class="form-text">poznámka k inputu</p>
</div>

• Modifikátory
• form-group__warning
• form-group__error

Šířka inputu se řeší pomocí gridu

  <main role="main" class="tom-bg d-flex">
    <div class="container align-self-center">
      <div class="row justify-content-center">
        <div class="col-lg-5">
          <div class="card">
            <div class="card-body">
              <h1 class="h1 pb-2">Přihlášení</h1>

                <div class="form-group ">
                  <label for="moleculeId" id="labelId" aria-label="" aria-labelledby="" class="form-control-label ">ID <span class="required"> </span> </label>
                  <input type="text" aria-labelledby="" aria-required="true" id="" name="input" tabindex="" placeholder="Placeholder" class="form-control " value="">
                </div>

                <div class="form-group ">
                  <label for="moleculeId" id="labelId" aria-label="" aria-labelledby="" class="form-control-label ">Heslo <span class="required"> </span> </label>
                  <input type="password" aria-labelledby="" aria-required="true" id="" name="input" tabindex="" placeholder="Heslo" class="form-control " value="">
                </div>

              <div class="text-center">
                <button type="button" class="btn btn-primary" aria-label="">Přihlásit</button>
              </div>

            </div>
          </div>
        </div>
      </div>
    </div>
  </main>

Základní grid a look pro Login page napříč aplikacemi.