Form controls

<div class="grid grid-cols-12 gap-4">

  <div class="col-span-12 md:col-span-6">
    <label for="" class="">First Name</label>
    <input type="text" class="ul-form-input" placeholder="First Name"/>
  </div>

  <div class="col-span-12 md:col-span-6">
    <label for="" class="">Last Name</label>
    <input type="text" class="ul-form-input" placeholder="Last Name"/>
  </div>

  <div class="col-span-12 md:col-span-6">
    <label for="" class="">Date</label>
    <input type="date" class="ul-form-input" placeholder=""/>
  </div>

  <div class="col-span-12 md:col-span-6">
    <label for="" class="">Password</label>
    <input type="password" class="ul-form-input" placeholder="write strongest password"/>
  </div>

  <div class="col-span-12 md:col-span-6">
    <label for="" class="">Select </label>
    <select id="cars" class="ul-form-input">
      <option value="volvo">Volvo</option>
      <option value="saab">Saab</option>
      <option value="opel">Opel</option>
      <option value="audi">Audi</option>
    </select>
  </div>

  <div class="col-span-12 md:col-span-6">
    <label for="" class="">username</label>
    <input type="text" class="ul-form-input" placeholder="username"/>
  </div>

  <div class="col-span-12">
    <textarea cols="30" rows="8" class="ul-form-input" placeholder="Message..."></textarea>
  </div>
</div>