Input

Input elements are used in Forms. Depending on type of input, the ability to style it varies. You should always use a label for your input elements for accessibility reasons.

Examples

Input

error message 
                

<div class="input-container mb-7">
  <input
    type="text"
    id="email"
    class="input input-lime-hover input-blue-focus"
    autocomplete="off"
    placeholder=" "
  />
  <label for="email" class="input-label text-grey-700 bg-white"
    >input outlined</label
  >
</div>

<div class="input-container mb-7">
  <input
    type="text"
    id="email"
    class="input input-grey-fill-light input-lime-hover input-blue-focus"
    autocomplete="off"
    placeholder=" "
  />
  <label for="email" class="input-label text-black bg-grey-200"
    >input filled</label
  >
</div>

<div class="input-container mb-7">
  <input
    type="text"
    id="email"
    class="input input-red input-red-focus"
    autocomplete="off"
    placeholder=" "
  />
  <label for="email" class="input-label text-red-500 bg-white"
    >input error</label
  >
  <small class="error text-red-500 text-sm">error message</small>
</div>
Image Lists