Form

<form style="display: flex; flex-direction: column; gap: 24px;">
  <h3>Create account</h3>
  <div class="nj-form-item">
    <div class="nj-form-item__field-wrapper">
      <input type="text" class="nj-form-item__field" id="exampleInputEmail" placeholder="default" required>
      <label for="exampleInputEmail" class="nj-form-item__label">Email</label>
    </div>
  </div>
  <div class="nj-form-item nj-form-item--password">
    <div class="nj-form-item__field-wrapper">
      <input type="password" class="nj-form-item__field" id="examplePassword" placeholder="password" required>
      <label for="examplePassword" class="nj-form-item__label">Password</label>
      <i class="nj-form-item__icon material-icons" tabindex="0">visibility</i>
    </div>
    <div class="nj-form-item__subscript">Must be at least 14 characters long</div>
  </div>
  <div class="nj-checkbox">
    <label>
      <input type="checkbox"> I acknoledge ...
    </label>
  </div>
  <button class="nj-btn nj-btn--block" type="submit">Create account</button>
</form>

<form style="display: flex; flex-direction: column; gap: 24px;">
  <h3>Contact form</h3>
  <div class="nj-form-item">
    <div class="nj-form-item__field-wrapper">
      <input type="text" class="nj-form-item__field" id="contactFormInputEmail" placeholder="default" required>
      <label for="contactFormInputEmail" class="nj-form-item__label">Email</label>
    </div>
  </div>
  <div class="nj-form-item">
    <div class="nj-form-item__field-wrapper">
      <input type="text" class="nj-form-item__field" id="contactFormInputFirstName" placeholder="default">
      <label for="contactFormInputFirstName" class="nj-form-item__label">Firstname</label>
    </div>
  </div>
  <div class="nj-form-item">
    <div class="nj-form-item__field-wrapper">
      <input type="text" class="nj-form-item__field" id="contactFormInputLastName" placeholder="default">
      <label for="contactFormInputLastName" class="nj-form-item__label">Lastname</label>
    </div>
  </div>
  <div class="nj-form-item nj-form-item--select nj-form-item--custom-list">
    <div class="nj-form-item__field-wrapper">
      <input class="nj-form-item__field" id="exampleSelect" placeholder=" " readonly/>
      <label for="exampleSelect" class="nj-form-item__label">How did you hear about us?</label>
      <div class="nj-form-item__list nj-list-group nj-list-group--no-border nj-list-group--sm">
        <button type="button" class="nj-list-group__item">Option 1</button>
        <button type="button" class="nj-list-group__item">Option 2</button>
        <button type="button" class="nj-list-group__item">Option 3</button>
        <button type="button" class="nj-list-group__item">Option 4</button>
      </div>
      <i class="nj-form-item__icon material-icons">keyboard_arrow_down</i>
    </div>
  </div>
  <div class="nj-form-item nj-form-item--textarea">
    <div class="nj-form-item__field-wrapper">
      <textarea class="nj-form-item__field" id="contactFormTextAreaFloat" placeholder="Comment"></textarea>
      <label for="contactFormTextAreaFloat" class="nj-form-item__label">Comment</label>
    </div>
  </div>
  <div class="d-flex">
    <button class="nj-btn" type="submit">Reach out</button>
  </div>
</form>